CSR でコンポーネント単位でデータを fetch すると責務を閉じ込められるけど fetch 回数が増えて UX が悪い。FCP、TTI、LCPが遅い
CSR でページコンポーネント単位でデータを fetch すると fetch 回数が減って UX が良くなるけど props のバケツリレーが大変。FCP、TTI、LCPが遅い
SSR するとハイドレーションが必要になるけどすぐに表示される。FCPが早い、TTI、LCPが遅い
SSG でページコンポーネント単位でデータを fetch するとハイドレーションが必要になるけどすぐに表示される。FCP、LCPが早い、TTIが遅い。
RSC だけ使って SSR するとコンポーネント単位でデータを fetch して責務を閉じ込められて、ハイドレーションが不要(JSのバンドル不要)ですぐ表示される。FCP、LCPが早い、TTIがほぼ無い。再レンダリングされないので動的なページが作れない
RSC + 'use client' でクライアント境界を作ると、クライアント境界の内側のみハイドレーションが必要ですぐ表示される。FCP、LCP、TTIが早い
こういうこと?🧐