References — fw-05 A Vue-like Renderer, and the Architecture Comparison
Primary sources first. Read the real implementation after you have written yours, never before.
Vue's renderer
@vue/runtime-coresource — start withrenderer.ts;patch,patchChildrenandpatchKeyedChildrenare the heart of it.runtime-dom— the platform-specific half, and a clean example of a renderer/host split- Vue docs — Rendering mechanism — compiler-informed fast paths, block trees, patch flags
- Custom renderer API — the seam that makes Vue retargetable
The diff algorithm
patchKeyedChildren— the two-ended diff plus longest-increasing-subsequence for minimal moves. Worth implementing the LIS step yourself; it is the one genuinely non-obvious algorithm in a renderer.- Inferno's diff — a different set of trade-offs at the same problem
- Snabbdom — the small VDOM library Vue 2's renderer was based on; extremely readable
The comparison this module is really about
- Rich Harris — Virtual DOM is pure overhead
- Vue docs — Rendering mechanism § compiler-informed — Vue's answer: keep the VDOM, let the compiler skip most of it
- js-framework-benchmark — the numbers everyone cites. Read its methodology before quoting it; it measures a specific workload, not "framework speed".
Related modules
- fw-02 — mini-react core · fw-03 — Signals · fw-06 — Compilers — the three architectures being compared
- fw-11 — Production source apprenticeship
- bi-04 — DOM internals — the cost model every renderer is optimising against
When a claim here proves stale, record it in PROGRESS.md section 7.