facebook/react
6 articles
前提知識
- ›JavaScript の基礎とモジュールシステム (import/export) の理解
- ›React の利用経験（コンポーネント、JSX、hooks）
- ›ビルドツール全般の概念的理解（バンドラー、モジュール解決）
01
アーキテクチャ概要と React ソースコードの読み方
React モノレポの構造、ビルドパイプライン、そしてフォークシステムによるコンパイル時の依存性注入を体系的に解説します。
02
Fiber データ構造 — React の内部表現
Fiber ノードの詳細解説。リンクリスト形式のツリー構造、ダブルバッファリング技法、WorkTag、ビットマスクによるフラグシステムを深掘りします。
03
ワークループ — React のレンダリングの仕組み
React のレンダー・コミットサイクルを完全解説。setState からレーンモデル、ワークループ、beginWork/completeWork、そして 3 つのコミットサブフェーズまで。
04
フックとディスパッチャー — React のステートマシン
React フックの内部動作を解説します。ディスパッチャーパターン、フックのリンクリスト、マウント時とアップデート時の切り替え、アップデートキュー、エフェクトシステムまで。
05
ホストコンフィグとDOM連携 — Reactとブラウザをつなぐ仕組み
ホストコンフィグという抽象化によってReactがレンダラーに依存しない設計を実現する方法と、react-dom-bindingsがブラウザ向けにそのインターフェースを実装する仕組み。
06
サーバーレンダリング — Fizz、Flight、React Server Components
Reactのサーバーサイドアーキテクチャを3つの観点から解説：ストリーミングSSRを担うFizz、RSCのシリアライズ/デシリアライズを担うFlight、そしてバンドラー統合。