Summary

Next.jsの新しい実験的キャッシュモードは、2つの概念（<Suspense> と "use cache"）に基づき、データを扱う際に明示的に「キャッシュするか動的にするか」を選択させます。fetch() やデータベースなどの任意の非同期APIは、選択を行わないとエラーになります。これにより隠れたキャッシュを排し、静的／動的／部分的レンダリングを分かりやすくコントロールできます。実装には関数レベルでのキャッシュ指定、タグ付け（cacheTag）、寿命指定（cacheLife）などのAPIが追加されており、既存のセグメント設定は後方互換で維持されます。現時点では実験段階のため、canaryとexperimental.dynamicIOフラグでの試用が推奨されます。

Key Points

• <Suspense> で囲むとその境界内は動的（毎リクエスト実行／ストリーミング）。デフォルトでキャッシュしない。
• ファイル／関数冒頭に "use cache" を付けるとそのセグメント（または関数）はキャッシュされ、静的レンダリング可能。
• 任意の async 関数に "use cache" を付けられる（引数・クロージャを含む自動キャッシュキー）。
• cacheTag() でキャッシュエントリにタグを付け、revalidateTag() で部分的に再検証可能。
• cacheLife() で寿命を簡易指定（"seconds","minutes","hours","days","weeks","max"、カスタムプロファイルも可）。クライアントのstaleやexpireも制御可能。
• キャッシュと動的データを混在させた場合、ビルド時にエラーで検出されるため意図的な選択を強制する。
• 既存の動的設定（export const dynamic 等）は後方互換で残るが、fetch() のデフォルト挙動は変更される可能性があり、現段階は実験的（グリーンフィールドでの検証を推奨）。

Try it (短縮)

• canaryで試す: npx create-next-app@canary
• next.config.ts に experimental.dynamicIO: true を有効化
• 詳細はドキュメントの use cache / cacheTag / cacheLife を参照