TL;DR
Web アプリケーションを作るためのデザインパターン、レンダリングのパターン、パフォーマンスのパターンをまとめた無料のオンラインリソース。素の JavaScript と、モダンなフレームワークの両方を扱う。
仕組み
扱う内容は大きく次の 4 つに分かれている。
- JavaScript のパターン: Singleton、Observer、Module、Factory などのパターンと、Dynamic Import、Preload、Tree Shaking などの読み込みやパフォーマンスの手法
- React Patterns: React と Next.js での Hooks、Compound、Server-side Rendering、Static Rendering、React Server Components など
- Vue Patterns: コンポーネント、Composables、状態管理など
- レンダリングとパフォーマンス: クライアントサイド、サーバーサイド、静的、インクリメンタルな静的レンダリングと、読み込みの最適化
注意点
サイトの立場は「やるべきことのチェックリストではなく、知るためのパターンのカタログ」である。パターンは記述的なものであり、規範的なものではない。問題を解く手がかりにはなるが、どこにでも当てはめるものではない。