Building a Custom React Renderer
summary
Builds a tiny custom renderer using react-reconciler, implements host methods like createInstance and createTextInstance, append/insert/remove child, event wiring for onClick, and prepareUpdate/commitUpdate so state and effects produce DOM mutations. Uses mutation mode and implements a custom BGColor prop to show how props map to DOM, all in about ~100 lines of code. Omits form control handling, SVG/portal quirks, attribute normalization and other production concerns.
AI-written summary · about
chapters (9)
- 0:00Start
- 1:34React Native
- 4:40Persistent Mode
- 5:44Mutation Mode
- 6:29Dom Api
- 7:50The Reconciler Module
- 8:19React Reconciler
- 10:57Create Instance
- 21:38Updating Properties of Components
related talks
01h 08mReact Reconciler: How to Write Your Own Renderer
26mWriting Your Own React Renderer
19mBuilding custom renderers with React
21mReact Beyond the DOM
26mBuild your own React
34mBuilding React From Scratch
45mWorkshop: Building a game in React and diving into react-reconciler (Part 2)
27mFun With Fiber Custom Renderers