English Vocabulary for the React Compiler

Learn the English vocabulary React developers use when discussing the React Compiler — automatic memoization, compiler directives, rules of React, and compiled output explained.

The React Compiler (previously called React Forget) is one of the most significant additions to the React ecosystem in years. It automatically optimizes React components and eliminates the need for manual useMemo and useCallback calls. As it moves into broader adoption, React developers need vocabulary to discuss it in code reviews, team meetings, and conference talks.

Key Vocabulary

Automatic Memoization Automatic memoization is the React Compiler’s core feature: it analyzes your components and hooks, determines which values and functions need to be memoized, and applies that memoization automatically. Developers say the compiler “applies,” “handles,” or “performs” automatic memoization. Example: “With automatic memoization enabled, we deleted all the hand-written useMemo calls in the component and the compiler handles it correctly.”

React Forget React Forget is the original internal name for the React Compiler project at Meta. It is still frequently used in conference talks and blog posts, especially in discussions of the compiler’s history. Developers may say “this was React Forget” or “the project formerly known as React Forget.” Example: “The React Compiler is what we publicly call what was internally React Forget — the goal was always to make manual memoization unnecessary.”

Compiler Directives Compiler directives are string literals placed at the top of a file or function to control compiler behavior. "use memo" opts a component into compilation; "use no memo" explicitly opts it out. Developers “add,” “apply,” or “use” directives. Example: “I added 'use no memo' at the top of the animation component because it uses a third-party library that violates the Rules of React.”

Rules of React The Rules of React are constraints that components and hooks must follow for the compiler to safely optimize them — for example, not mutating props, calling hooks at the top level, and not relying on referential identity of objects between renders. The compiler “enforces,” “checks,” or “validates” these rules. Example: “The compiler flagged a violation of the Rules of React because the component was mutating a prop object directly instead of creating a new one.”

useMemo / useCallback Elimination One of the compiler’s main benefits is that developers no longer need to manually wrap values in useMemo or functions in useCallback. The compiler “eliminates the need for,” “removes the requirement for,” or “makes redundant” these hooks. Example: “After enabling the compiler, we ran a codemod to remove all unnecessary useMemo and useCallback wrappers that the compiler now handles automatically.”

Compiler Output The compiler transforms your JavaScript or TypeScript source into optimized code. Developers “inspect,” “examine,” or “check” the compiler output to understand what the compiler did. The React DevTools playground shows the compiled output visually. Example: “I inspected the compiler output for this component and saw that it generated memoization wrappers around three expensive calculations.”

Concurrent Mode Integration The React Compiler is designed to work with React’s concurrent features — Suspense, transitions, and deferred values. Developers discuss “concurrent mode compatibility,” “working with concurrent features,” or “concurrent rendering support.” Example: “The compiler’s automatic memoization is especially valuable with concurrent mode because it reduces the work React does during deferred rendering.”

Opt-in / Opt-out The compiler supports gradual adoption — you can opt specific files or components in or out of compilation. Developers “opt in” a component or “opt out” a file. The entire application can be opted in via the Babel or SWC plugin configuration. Example: “We opted out the legacy form component because it uses a deprecated pattern that the compiler does not yet handle correctly.”

Common Phrases and Collocations

“enable the React Compiler” The standard phrase for adding the compiler plugin to your build configuration. “Enable” — not “install” or “activate.” Example: “Enable the React Compiler by adding the Babel plugin to your build config and setting the target to your React version.”

“the component violates compiler rules” Used when the compiler detects a Rules of React violation and skips that component. “Violates” is the standard verb. Example: “The compiler skipped this component because it violates compiler rules — specifically, it reads from a ref during render.”

“inspect the compiled output” Used when verifying what the compiler generated. Always “inspect” in professional discussions — more precise than “look at” or “check.” Example: “Inspect the compiled output in the React DevTools playground to verify the compiler is memoizing the expensive calculation.”

“gradual adoption” Describes rolling out the compiler incrementally across a codebase rather than enabling it everywhere at once. Teams “take a gradual adoption approach” or “adopt the compiler gradually.” Example: “We took a gradual adoption approach — enabling the compiler file by file in a monorepo over three sprints.”

“compiler bail-out” When the compiler cannot safely optimize a component due to a rules violation, it “bails out” — leaves that component unchanged. Developers “see a bail-out,” “trigger a bail-out,” or “investigate why the compiler bailed out.” Example: “The compiler bail-out on the data table component means it will still rely on manual useMemo until we refactor the mutation.”

Practical Sentences to Practice

  1. “After enabling the React Compiler, our bundle re-renders dropped significantly without any manual memoization changes.”
  2. “The component violates compiler rules because it mutates the items array in place — we need to return a new array instead.”
  3. “Add 'use no memo' to any component that uses direct DOM manipulation outside of React’s model.”
  4. “Inspect the compiled output to confirm the compiler is correctly identifying which props can change between renders.”
  5. “We plan gradual adoption — starting with the stateless utility components where violations are least likely.”

Common Mistakes to Avoid

Saying “the compiler memoizes the component” The compiler memoizes values and functions inside the component, not the component itself. The correct phrase is “the compiler memoizes the expensive calculation” or “the compiler applies memoization to the hook’s return value.”

Confusing “opt in” and “opt out” With the Babel plugin configured globally, components are opted in by default. Saying a component is “opted in” when you mean the whole project is enabled is imprecise. Specify the scope: “the entire project is opted in” vs “this specific file is opted out.”

Calling directives “comments” "use memo" and "use no memo" are string literal directives, not comments. Calling them “comments” is incorrect — they are evaluated JavaScript strings, similar to "use strict" or "use client" in React Server Components.

Summary

The React Compiler introduces a focused vocabulary — automatic memoization, compiler directives, Rules of React, bail-outs, and gradual adoption — that you will encounter frequently in React team discussions, RFC discussions on GitHub, and conference talks from the React core team. The best resource for natural English exposure is the React Compiler RFC on GitHub and the Meta Engineering blog posts about React Forget, where the engineers who built the compiler explain their decisions in clear, professional English.