Start Here
The beginner entry point: reading order, a plain-English glossary and the top interview questions.
ReadModule 7 of 7
How React works under the hood, meaning reconciliation, the Fiber architecture, the work loop, the commit phase, scheduling and hooks, at the level a frontend developer needs to reason about their own code. It's not a workshop write-up. The notes are built from react.dev, the React team's own architecture writing, and the React 19.2.5 source (react-dom-client.development.js, scheduler.development.js), which every algorithm here was checked against.
Everything follows one throughline. Your components return elements → React reconciles them against a tree of fibers → it walks that tree in a loop it can pause → it commits the result to the DOM in one go. The optimizations in React Performance and the concurrent features in React Suspense are all consequences of that pipeline.
New to this? Start with React Internals - Start Here: the reading order, a plain-English glossary, and interview-value labels ( must know · good to know · skip).
beginWork)completeWork)useLayoutEffect, refsRead them in order. Each one builds on the ones before it.
The beginner entry point: reading order, a plain-English glossary and the top interview questions.
ReadThe pipeline: trigger → render → commit → paint → effects, why render must be pure, and what the "virtual DOM" really is.
ReadThe O(n³) → O(n) heuristics (type and key), and why state is tied to position in the tree.
ReadWhy the stack reconciler couldn’t pause, what a fiber holds, the child/sibling/return tree and double buffering.
ReadThe hook linked list, why the Rules of Hooks exist, the setState update queue and the eager bailout.
ReadCommit sub-phases, the tree swap, and exactly when refs, useLayoutEffect and useEffect run.
ReadLanes as a priority bitmask, automatic batching, time slicing, interruption and starvation.
ReadThe keyed list diff: lockstep fast path, the key Map and the lastPlacedIndex move heuristic.
ReadOne click traced through ~30 real React functions, from the native event to paint and effects.
ReadA real 2-page app followed from JSX to pixels: Babel output, element objects, every component call, commit, clicks, lists and a page switch.
ReadLost in function names? The map of React’s internals: what calls what, which names matter, a plain-English glossary and flashcards.
Read