エントリーの編集は全ユーザーに共通の機能です。
必ずガイドラインを一読の上ご利用ください。
ここにツイート内容が記載されます https://b.hatena.ne.jp/URLはspanで囲んでください
Twitterで共有ONにすると、次回以降このダイアログを飛ばしてTwitterに遷移します
ある日、Vercelのダッシュボードを見ると以前はだいたい100KB前後だったページのレスポンスサイズが500K... ある日、Vercelのダッシュボードを見ると以前はだいたい100KB前後だったページのレスポンスサイズが500KB前後に増えてしまっていました。 原因はサーバコンポーネントからクライアントコンポーネントに渡すpropsが巨大だったことでした。 SCからCCに渡したpropsはRSCペイロードという形で初回レスポンスのHTMLに含まれるためです。 分かってしまえば単純なことなのですが、当時Next.jsのバージョンアップなどの改修も同時に行なっていたために原因調査に手こずりました。 そんなわけで、レスポンスサイズが5倍になったときの調査に役に立つかもしれない(?)RSCペイロードの覗き方を簡潔にお伝えします。 RSCペイロードを覗く Next.jsでRSCペイロードがどう扱われているのか、実際に覗いてみます。 以下の3つのファイルを用意して確かめます。 import ClientCompon