SSRとReact Server Components の違いをレスポンスから考える - Qiita

概要 Next.js 13からApp Routerが追加され、それはReact Server Components（以下RSC)と呼ばれる機能の使用に適した設計がされています。RSCはサーバー側でレンダリングをしてバンドルサイズを小さくする、サーバー側でネットワーク呼び出しを完結させるなどのメリットがあります。そこで気になったのが、SSRもサーバー側でレンダリングする機能の一つで、RSCと何が違うということです。 この違いは既に多くの記事で言及されています。本記事では、よりイメージを明確にするため実際の生成物を調べながら違いを考えてみます。特に、レスポンスされるHTMLとJavaScript内のコンポーネント情報の２つの観点に注目します。 この記事の目的 SSRとRSCのレンダリング結果の違いを実際の生成物を元に知る Next.jsがSSRとRSCをどのように組み合わせているのかを知る 環