finds.dev← search

// the find

sophiebits/react-dom-mini

★ 601 · JavaScript · MIT · updated Jan 2023

Toy React renderer from my React Conf 2019 talk, "Building a Custom React Renderer"

A toy React renderer built by Sophie Alpert (former React core team) for a 2019 conference talk. The entire renderer lives in one ~150-line file, showing how react-reconciler wires up to a host environment. If you've ever wondered what 'custom renderer' actually means, this is the clearest starting point.

The single-file renderer makes the core concepts impossible to hide behind abstractions — you can read the whole thing in 20 minutes. Sophie Alpert wrote it, which means the design choices reflect actual React internals knowledge, not guesswork. It pairs directly with a recorded talk, so you have a guided walkthrough of every decision. The diff between 'toy' and 'real' renderer is small enough to see, which is the whole point.

It's from 2019 and hasn't been touched since 2023 — React has moved considerably (concurrent features, Fiber scheduling nuances) and this doesn't reflect any of that. It's a CRA project, so the scaffolding is already obsolete. There's no path forward here: it's a demo, not a template you'd build on. If you want a production-ready custom renderer starting point, you'd need ink or react-three-fiber as a reference instead.

View on GitHub →

// want more like this?

We dig through GitHub every week and send a few repos picked for what you actually care about — each with an honest take like this one.

Get finds in your inbox → Search again →