From 08aa999190fa4dd37f0dab89ff4530bbbb7a77de Mon Sep 17 00:00:00 2001 From: Dan Abramov Date: Sat, 11 Oct 2025 17:35:48 +0100 Subject: [PATCH] edit --- src/content/blog/2025/10/07/react-compiler-1.md | 4 +++- src/content/learn/react-compiler/introduction.md | 3 ++- 2 files changed, 5 insertions(+), 2 deletions(-) diff --git a/src/content/blog/2025/10/07/react-compiler-1.md b/src/content/blog/2025/10/07/react-compiler-1.md index a53acb1ab..a24bbb8ca 100644 --- a/src/content/blog/2025/10/07/react-compiler-1.md +++ b/src/content/blog/2025/10/07/react-compiler-1.md @@ -28,7 +28,9 @@ We are releasing the compiler's first stable release today. React Compiler works [React Compiler](/learn/react-compiler) is a build-time tool that optimizes your React app through automatic memoization. -You can get an intuitive sense of how the Compiler works by [looking at the playground](https://playground.react.dev/#N4Igzg9grgTgxgUxALhAMygOzgFwJYSYAEAKhACYQAyeYOAFMEThRGADRFp4A2OCMIgF8AlEWAAdYkTiE6XXvxgJyZSmCIBeZqzAA6bnwH0cWgHzM9dAIY4oGzY4VGYIgNxSiRT1yy4CxAAW1pjkPAgAwjx4cADW9HjkYpLSXrKYkOF6PBAA5glJPkLexD7KdjDEADw08nj8ALZgmsCGSipqbMWEUTGxLcGh4b1xxQD0Zh6YQiDsIOncuSggeA0ADhAwpjgAnmsI4kQACjxQuXiYAPJr+HLCXDAQDUQA5ABG1m8IPAC0a6fnTA-ZTWXA-WTrXgCMbkWg4F5TKSMHxjMYQta8WwBACyFAQyG8IGsPB4EhAUmKYCxYG4CA0JzOF2utwy7lm4ECEAA7gBJTBKTDEsAoHAwKAIIRAA). Fundamentally, React Compiler relies on an old idea from functional programming: pure functions don't "do" anything (they only compute things), so it is safe to reorder their calls, or to reuse their past output for the same inputs. React Compiler checks that your code follows the [Rules of React](https://react.dev/reference/rules) which ensure your code can be reordered this way. +You can get an intuitive sense of how the Compiler works by [looking at the playground](https://playground.react.dev/#N4Igzg9grgTgxgUxALhAMygOzgFwJYSYAEAKhACYQAyeYOAFMEThRGADRFp4A2OCMIgF8AlEWAAdYkTiE6XXvxgJyZSmCIBeZqzAA6bnwH0cWgHzM9dAIY4oGzY4VGYIgNxSiRT1yy4CxAAW1pjkPAgAwjx4cADW9HjkYpLSXrKYkOF6PBAA5glJPkLexD7KdjDEADw08nj8ALZgmsCGSipqbMWEUTGxLcGh4b1xxQD0Zh6YQiDsIOncuSggeA0ADhAwpjgAnmsI4kQACjxQuXiYAPJr+HLCXDAQDUQA5ABG1m8IPAC0a6fnTA-ZTWXA-WTrXgCMbkWg4F5TKSMHxjMYQta8WwBACyFAQyG8IGsPB4EhAUmKYCxYG4CA0JzOF2utwy7lm4ECEAA7gBJTBKTDEsAoHAwKAIIRAA). + +Like many features in React itself, the React Compiler relies on an old idea from functional programming: pure functions don't "do" anything (they only compute things), so it is safe to reorder their calls, or to reuse their past output for the same inputs. The React Compiler first checks that your components follow the [Rules of React](https://react.dev/reference/rules), and for those that do, it breaks up the code into blocks that can be safely skipped or reordered. You can jump straight to the [quickstart](/learn/react-compiler), or read on for the highlights from React Conf 2025. diff --git a/src/content/learn/react-compiler/introduction.md b/src/content/learn/react-compiler/introduction.md index 742fdad13..aa5928c0f 100644 --- a/src/content/learn/react-compiler/introduction.md +++ b/src/content/learn/react-compiler/introduction.md @@ -89,8 +89,9 @@ React Compiler automatically applies the optimal memoization, ensuring your app ## How does React Compiler work? {/*how-does-react-compiler-work*/} -You can get an intuitive sense of how the Compiler works by [looking at the playground](https://playground.react.dev/#N4Igzg9grgTgxgUxALhAMygOzgFwJYSYAEAKhACYQAyeYOAFMEThRGADRFp4A2OCMIgF8AlEWAAdYkTiE6XXvxgJyZSmCIBeZqzAA6bnwH0cWgHzM9dAIY4oGzY4VGYIgNxSiRT1yy4CxAAW1pjkPAgAwjx4cADW9HjkYpLSXrKYkOF6PBAA5glJPkLexD7KdjDEADw08nj8ALZgmsCGSipqbMWEUTGxLcGh4b1xxQD0Zh6YQiDsIOncuSggeA0ADhAwpjgAnmsI4kQACjxQuXiYAPJr+HLCXDAQDUQA5ABG1m8IPAC0a6fnTA-ZTWXA-WTrXgCMbkWg4F5TKSMHxjMYQta8WwBACyFAQyG8IGsPB4EhAUmKYCxYG4CA0JzOF2utwy7lm4ECEAA7gBJTBKTDEsAoHAwKAIIRAA). Fundamentally, React Compiler relies on an old idea from functional programming: pure functions don't "do" anything (they only compute things), so it is safe to reorder their calls, or to reuse their past output for the same inputs. React Compiler checks that your code follows the [Rules of React](https://react.dev/reference/rules) which ensure your code can be reordered this way. +You can get an intuitive sense of how the Compiler works by [looking at the playground](https://playground.react.dev/#N4Igzg9grgTgxgUxALhAMygOzgFwJYSYAEAKhACYQAyeYOAFMEThRGADRFp4A2OCMIgF8AlEWAAdYkTiE6XXvxgJyZSmCIBeZqzAA6bnwH0cWgHzM9dAIY4oGzY4VGYIgNxSiRT1yy4CxAAW1pjkPAgAwjx4cADW9HjkYpLSXrKYkOF6PBAA5glJPkLexD7KdjDEADw08nj8ALZgmsCGSipqbMWEUTGxLcGh4b1xxQD0Zh6YQiDsIOncuSggeA0ADhAwpjgAnmsI4kQACjxQuXiYAPJr+HLCXDAQDUQA5ABG1m8IPAC0a6fnTA-ZTWXA-WTrXgCMbkWg4F5TKSMHxjMYQta8WwBACyFAQyG8IGsPB4EhAUmKYCxYG4CA0JzOF2utwy7lm4ECEAA7gBJTBKTDEsAoHAwKAIIRAA). +Like many features in React itself, the React Compiler relies on an old idea from functional programming: pure functions don't "do" anything (they only compute things), so it is safe to reorder their calls, or to reuse their past output for the same inputs. The React Compiler first checks that your components follow the [Rules of React](https://react.dev/reference/rules), and for those that do, it breaks up the code into blocks that can be safely skipped or reordered. #### What kind of memoization does React Compiler add? {/*what-kind-of-memoization-does-react-compiler-add*/}