The React Compiler is officially stable
The React Compiler, previously shipped as an opt-in Babel plugin, is now stable and recommended for new projects. Its job hasn't changed since the earlier release candidates: it statically analyzes components and automatically inserts the memoization you'd otherwise hand-write with useMemo, useCallback, and React.memo.
What it actually does
// what you write
function ProductList({ items, filter }) {
const visible = items.filter((i) => i.category === filter);
return visible.map((item) => <ProductCard key={item.id} item={item} />);
}
// what the compiler effectively produces — memoized automatically,
// no manual useMemo/dependency array required
The compiler doesn't change component behavior — it changes when re-renders actually happen, skipping ones where the compiler can prove the output would be identical. Components that follow the Rules of React (no mutating props or state during render) get this for free; ones that don't are skipped by the compiler rather than silently miscompiled, and get flagged by the accompanying ESLint plugin.
This mostly matters for codebases that either over-memoize defensively (littering every component with useMemo/useCallback "just in case") or under-memoize and eat the re-render cost. Both patterns get simpler — the manual memoization hooks aren't removed from React, but for most components they stop being something you need to reach for.
Adopting it
The compiler ships as a build-time plugin (Babel, or via the Next.js/Vite integration) and is designed to be adopted incrementally — it can be enabled per-directory, so an existing large app doesn't need a big-bang migration. The real prerequisite is passing the Rules of React ESLint checks first, since components that violate them are exactly the ones the compiler has to leave alone.
Source: react.dev