IT-Q

Server Component の中の fetch は、既定でキャッシュされますか。

されません。公式は「fetch は既定でキャッシュされない」と書いています。App Router の初期は既定でキャッシュされる仕様だったため、古い記事を読むと逆の説明に当たります。

面接官が見ているのは🔴 バージョンで変わった箇所。古い知識で答えると「2〜3年前で止まっている」と見られる。

よくある答えと、面談でどう見られるか

  • されない。したい場合は cache 指定や "use cache" で明示する
    App Router 初期は既定でキャッシュしていたので、そこが変わった箇所です。
  • される。不要なら no-store を指定する
    それは 13〜14 系の挙動です。現在は既定でキャッシュされません。
  • 静的レンダリングならキャッシュされ、動的ならされない
    レンダリング方式とデータキャッシュは別の層の話です。fetch 単体の既定は「しない」です。
  • 同一リクエスト内では再利用されるが、リクエストをまたぐと再取得される
    前半はメモ化の説明として正しいのですが、キャッシュとは別の仕組みです。

模範解答

既定ではキャッシュされません。公式は「fetch リクエストは既定でキャッシュされず、完了するまでページの描画をブロックする」と書いています。

ここはバージョンで変わった箇所です。App Router の初期(13〜14)は既定でキャッシュされる仕様で、「勝手にキャッシュされて古いデータが出る」という声が多く出ました。その後、既定はキャッシュしない方向に変わりました。

キャッシュしたい場合は fetch(url, { cache: 'force-cache' }) のように明示するか、"use cache" ディレクティブを使います。

なお、同じ fetch がコンポーネントツリー内で重複した場合は既定でメモ化されるので、props で引き回さずに必要な場所で取って構いません。これはキャッシュとは別の仕組みです。