From d92bec60c7b77435caee0592021f2fa595f7b501 Mon Sep 17 00:00:00 2001 From: Piotr Tomczewski Date: Mon, 16 Dec 2024 14:59:52 +0100 Subject: [PATCH 1/3] docs[compiler]: clarify React DevTools support for Compiler Badges in React Native --- src/content/learn/react-compiler.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/content/learn/react-compiler.md b/src/content/learn/react-compiler.md index 5362d69e1d2..fd00ad4d237 100644 --- a/src/content/learn/react-compiler.md +++ b/src/content/learn/react-compiler.md @@ -347,7 +347,7 @@ React Compiler can verify many of the Rules of React statically, and will safely ### How do I know my components have been optimized? {/*how-do-i-know-my-components-have-been-optimized*/} -[React Devtools](/learn/react-developer-tools) (v5.0+) has built-in support for React Compiler and will display a "Memo ✨" badge next to components that have been optimized by the compiler. +[React Devtools](/learn/react-developer-tools) (v5.0+) has built-in support for React Compiler and will display a "Memo ✨" badge next to components that have been optimized by the compiler. In React Native, this feature is available from version 0.75.0 onwards, since React Native bundles its own DevTools backend. ### Something is not working after compilation {/*something-is-not-working-after-compilation*/} If you have eslint-plugin-react-compiler installed, the compiler will display any violations of the rules of React in your editor. When it does this, it means that the compiler has skipped over optimizing that component or hook. This is perfectly okay, and the compiler can recover and continue optimizing other components in your codebase. **You don't have to fix all ESLint violations straight away.** You can address them at your own pace to increase the amount of components and hooks being optimized. From c6d8e3b594f91c835234cd183f4ed1e898579882 Mon Sep 17 00:00:00 2001 From: dan Date: Mon, 16 Dec 2024 16:12:40 +0000 Subject: [PATCH 2/3] Update react-compiler.md --- src/content/learn/react-compiler.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/content/learn/react-compiler.md b/src/content/learn/react-compiler.md index fd00ad4d237..e9ce0553c94 100644 --- a/src/content/learn/react-compiler.md +++ b/src/content/learn/react-compiler.md @@ -347,7 +347,7 @@ React Compiler can verify many of the Rules of React statically, and will safely ### How do I know my components have been optimized? {/*how-do-i-know-my-components-have-been-optimized*/} -[React Devtools](/learn/react-developer-tools) (v5.0+) has built-in support for React Compiler and will display a "Memo ✨" badge next to components that have been optimized by the compiler. In React Native, this feature is available from version 0.75.0 onwards, since React Native bundles its own DevTools backend. +[React DevTools](/learn/react-developer-tools) (v5.0+) and [React Native DevTools](https://reactnative.dev/docs/react-native-devtools) has built-in support for React Compiler and will display a "Memo ✨" badge next to components that have been optimized by the compiler. ### Something is not working after compilation {/*something-is-not-working-after-compilation*/} If you have eslint-plugin-react-compiler installed, the compiler will display any violations of the rules of React in your editor. When it does this, it means that the compiler has skipped over optimizing that component or hook. This is perfectly okay, and the compiler can recover and continue optimizing other components in your codebase. **You don't have to fix all ESLint violations straight away.** You can address them at your own pace to increase the amount of components and hooks being optimized. From 62098b45318a18a2e64ffaac39b38580ebf80c75 Mon Sep 17 00:00:00 2001 From: dan Date: Mon, 16 Dec 2024 16:12:57 +0000 Subject: [PATCH 3/3] Update react-compiler.md --- src/content/learn/react-compiler.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/content/learn/react-compiler.md b/src/content/learn/react-compiler.md index e9ce0553c94..0ae49947266 100644 --- a/src/content/learn/react-compiler.md +++ b/src/content/learn/react-compiler.md @@ -347,7 +347,7 @@ React Compiler can verify many of the Rules of React statically, and will safely ### How do I know my components have been optimized? {/*how-do-i-know-my-components-have-been-optimized*/} -[React DevTools](/learn/react-developer-tools) (v5.0+) and [React Native DevTools](https://reactnative.dev/docs/react-native-devtools) has built-in support for React Compiler and will display a "Memo ✨" badge next to components that have been optimized by the compiler. +[React DevTools](/learn/react-developer-tools) (v5.0+) and [React Native DevTools](https://reactnative.dev/docs/react-native-devtools) have built-in support for React Compiler and will display a "Memo ✨" badge next to components that have been optimized by the compiler. ### Something is not working after compilation {/*something-is-not-working-after-compilation*/} If you have eslint-plugin-react-compiler installed, the compiler will display any violations of the rules of React in your editor. When it does this, it means that the compiler has skipped over optimizing that component or hook. This is perfectly okay, and the compiler can recover and continue optimizing other components in your codebase. **You don't have to fix all ESLint violations straight away.** You can address them at your own pace to increase the amount of components and hooks being optimized.