Advanced React

Apply Advanced React (Nadia Makarevich, 2023) to a React change: a named composition shape, code that matches it, or a review that cites the book's rules by name. The rules, one per name, live in references/lenses.md; check a chapter there before resting a claim on it.

Detect the target

From package.json (and the lockfile if the range is loose), record:

• React major. The book matches 17/18. Where the detected version disagrees, follow the detected framework and say so: "on the detected React 19, ref is a prop."
• Compiler coverage of the affected components. A dependency or lint rule is a clue, not proof. Under the compiler, leave render-only memo / useMemo / useCallback to react; everything else here still applies.
• Store: TanStack Query, SWR, Apollo, RTK Query, Zustand, Jotai, Redux Toolkit, or none.
• UI library: MUI, Radix, Headless UI, shadcn/ui, Chakra, Ant, or hand-rolled. A styled-component-heavy library makes parent re-renders expensive; weight the re-render rules higher.

The two anchors

Re-renders myth. A state update re-renders its owner and every nested component, props or not. Props matter only under React.memo. A custom hook is a pocket, not a move: its state re-renders whoever calls it.

Composition-first. Structure beats memoization. Say it as you decide: "this is composition-first: the hot state moves down before any memo is added." React.memo is the last rung, because one recreated non-primitive prop, children included, silently defeats it.