facebook/react

The package you import from, and it renders nothing at all. It creates element objects, declares the hook and context APIs, and forwards every hook call to whichever renderer is currently mounting — the implementation lives there, not here.

import { useState } from 'react'

A priority queue and a yield loop, with nothing React-specific in it. It runs callbacks in slices and hands control back to the browser every few milliseconds, so a long render cannot sit on the main thread and block paint or input.

scheduleCallback(NormalPriority, work)

The browser entry point — createRoot, hydrateRoot, createPortal, flushSync. It is a thin public surface over the reconciler wired to the DOM host config, which is why it is a separate install from react in the first place.

createRoot(document.getElementById('root'))
  .render(<App />)

Everything that actually knows about the DOM: creating and patching nodes, deciding attribute versus property, and the synthetic event system — one delegated listener per root that replays the bubble along the fiber tree rather than the DOM one.

// one listener on the root container,
// dispatched down the fiber path

The same reconciler pointed at native views instead of elements. It sits in this repo next to react-dom because that is the proof the split holds: swap the host config and the whole component model comes with you unchanged.

// same fibers, different host nodes

Server Components: a renderer whose output is a stream, not a tree of nodes. It serialises the rendered output into the Flight format and leaves holes where client components go, which the bundler binding fills with chunk references the browser can fetch.

renderToPipeableStream(<Page />, manifest)

Classic server rendering: walk the tree once, push HTML strings into a stream, never diff anything. It also plants the markers hydrateRoot reads on the client so the first render can adopt the existing DOM instead of replacing it.

const stream = renderToPipeableStream(<App />)

The pieces every other package needs and none of them should own: the element and portal symbols, the feature flags each build is compiled against, and ReactSharedInternals — the single mutable slot through which react and a renderer find each other.

import { REACT_ELEMENT_TYPE } from 'shared/ReactSymbols'

Element type checks, published so that libraries inspecting children can ask the same question React asks — isValidElement, isFragment, typeOf. The alternative is every library guessing at symbols it does not own.

isValidElement(node)

Fast Refresh. A Babel transform registers each component under a stable identity, and this runtime swaps the implementation in place and re-renders, keeping the hook state of every component whose hook signature did not change.

// edit a component, keep its state

The rules of hooks, enforced before the code runs. Hook state is matched by call order, so a hook behind an if silently reads the wrong slot — a class of bug the runtime cannot always catch, shipped as a lint rule from the same repo instead.

react-hooks/rules-of-hooks
react-hooks/exhaustive-deps