React Compiler: what changes in your code

React Compiler does not change what you write: it reads components at build time and inserts the memoisation you used to add by hand with useMemo and useCallback.

What leaves the code

Manual memoisation was a defence: without it, every render rebuilt arrays, objects and callbacks, and memoised children re-rendered anyway. The compiler does the same work with one extra condition, that the component is pure enough to analyse.

// prima: memoizzazione scritta a mano
const rows = useMemo(() => sortRows(data), [data]);

// dopo: il compilatore inserisce la stessa memoizzazione
const rows = sortRows(data);

What it needs to work

• Rules of hooks: no conditional hooks and none inside loops, or the component is skipped.
• Pure components: mutating a prop or an outer variable during render blocks the optimisation.
• Lint on: eslint-plugin-react-hooks reports the violations the compiler treats as bailouts.

Installation

npm i -D babel-plugin-react-compiler
npx react-compiler-healthcheck

The plugin ships under the MIT licence. react-compiler-healthcheck scans the project and prints how many components compile: that is the number to read before deleting manual memoisation.

What does not change

The compiler does not reduce the number of renders, it only avoids wasted work inside a render. When a component re-renders because state sits in the wrong place, the cost stays: move the state there, do not add a library.

Live records in the catalogue

Three components with lists and tables, where memoisation shows: lumina-interactive-list, interactive-logs-table and ruixen-contributors-table. To browse by category start from 111,985 components.

The limitation

Bailouts are silent: a skipped component compiles without errors and without gain, and the only signal is the healthcheck count. The optimised code is also harder to read while debugging, because the computed dependencies never appear in the source.

Where to continue

What version 19 changed is in React 19; the key mistakes that break memoisation are in key warnings in lists; the measured library comparison is in React libraries 2026.