上級者向け 30 分サマリ

AI 生成による付録

この付録は chibivue 本編の内容をもとに GPT-5.5 で草案化したものです．学習ルートとして利用し，正確な実装や詳しい説明は本編と実装コードを参照してください．

これは，ソースコードを読む前に本全体を 1 回で俯瞰したい人向けの圧縮 map です．1 checkpoint あたり 1 分くらいで眺めてください．明らかなら先に進み，曖昧ならリンク先の章を開きます．

30 checkpoints

1. この本は 1 行の rendering から始まる: Vue を完全 clone することではなく，考え方を手で再構築することが目的です．
2. Vue の core pieces: runtime，renderer，reactivity，compiler，SFC tooling は別の関心事です．
3. Project setup: package boundary は学習 path を見えるようにします．
4. createApp: app API は mount を包み，user に 1 つの entry point を渡します．
5. Package architecture: runtime-core は platform neutral，runtime-dom は browser operation を担当します．
6. h と VNode: render output は DOM ではなく data structure です．
7. Events and attributes: DOM patching には platform specific な prop handling が必要です．
8. Minimum reactivity: Proxy read は track，Proxy write は trigger です．
9. Minimum Virtual DOM: patch は old VNode と new VNode を比べて DOM を更新します．
10. Minimum components: component VNode は instance を作り，render を実行することで mount されます．
11. Props: parent data は normalize された入力として child component に渡ります．
12. Emits: child event は，命名規則に沿った parent handler として扱えます．
13. Template compiler overview: template は render function になります．
14. Compiler implementation: parse，transform，codegen が compiler pipeline の中心です．
15. Template binding: compiler output は render context から値を読む必要があります．
16. SFC parse: .vue file は script，template，style block に分解されます．
17. SFC template/script/style: Vite plugin が SFC transform を development に接続します．
18. Keyed patching: stable key によって renderer は child を移動し，再利用できます．
19. Shape flags: bit flag は繰り返しの type check を安くします．
20. Scheduler: reactive change は work を queue に積み，update を batch できます．
21. ref, computed, watch: reactivity は object から value container と user-facing effect に広がります．
22. Reactive proxy handlers: collection，ref，readonly，shallow value には handler の nuance が必要です．
23. Effect cleanup and scope: effect には rerun だけでなく lifecycle management が必要です．
24. Component lifecycle: component instance は user hook を呼ぶ場所を runtime に与えます．
25. Provide/Inject and setup context: component tree には構造化された dependency と context の channel が必要です．
26. Slots: children は lazy render function として渡せます．
27. Template transforms: directive は syntax を VNode data に変える compiler plugin です．
28. Structural directives: v-if，v-for，fragment，comment，slot は generated tree の形を決めます．
29. SFC compiler macros: script setup，defineProps，defineEmits，scoped CSS，type-based macros は compile-time convenience です．
30. Application essentials and optimizations: router，store，SSR，built-ins，static hoisting，patch flags，tree flattening，Vapor Mode は，同じ core ideas がどう拡張されるかを見せます．

サマリ後に読む source path

止まらずに 1 回流して読むなら，この順番がおすすめです．

packages/reactivity -> packages/runtime-core -> packages/runtime-dom -> packages/compiler-core -> packages/compiler-sfc

その後で 本家のソースコードをデバッグする を読み，chibivue の簡略化された選択と vuejs/core を比較してください．