sveltejs/svelte
5 articles
前提知識
- ›Svelte コンポーネントの基本的な知識
- ›npm パッケージ構成と ES modules の理解
- ›フロントエンドフレームワークの一般的な動作に関する知識
01
Svelte 5 コードベースアーキテクチャ:全体像を把握するための地図
Svelte 5 モノレポの包括的な入門ガイド。コンパイラとランタイムが共存するデュアルアーキテクチャ、conditional exports、内部 ABI、feature flags、そして Markdown ドリブンなエラーパイプラインまでを解説します。
02
Svelteコンパイラの内側:.svelteソースからJavaScript出力まで
コンパイラの3フェーズパイプラインを詳しく解説します。ステートマシンによるパース、スコープとrunesの解析、そしてASTを最適化されたJavaScriptへ変換する仕組みを追います。
03
リアクティビティエンジン:Sources・Deriveds・Effects とバッチスケジューラ
Svelte 5 のプルベース型シグナルリアクティビティシステムを深掘りします。3 つのリアクティブプリミティブ、ビットフラグ、依存関係トラッキング、エフェクトツリー、ダーティチェック、バッチスケジューラまで徹底解説。
04
DOMレンダリング:テンプレート、制御フローブロック、ハイドレーション
Svelteのコンパイル出力がどのようにDOMを生成・更新するか — テンプレートのクローン、mount/hydrateエントリーポイント、制御フローブロック、ハイドレーションプロトコル、SSR Rendererクラスを解説します。
05
サポートシステム:リアクティブユーティリティ、マイグレーション、開発ツール、テスト
Svelte 体験を完成させるサブシステム — リアクティブユーティリティクラス、Svelte 4→5 マイグレーション、ストア互換性、開発モード機能、トランジション、そしてテストインフラ。