メインコンテンツまでスキップ

staleTimes

staleTimesは、クライアントサイドルーターキャッシュのページセグメントのキャッシュを可能にする実験的な機能です。

この実験的な機能を有効にし、カスタムの再検証時間を設定するには、実験的なstaleTimesフラグを設定します。

next.config.js
/** @type {import('next').NextConfig} */
const nextConfig = {
  experimental: {
    staleTimes: {
      dynamic: 30,
      static: 180,
    },
  },
}

module.exports = nextConfig

staticおよびdynamicプロパティは、異なる種類のリンクプリフェッチに基づく時間（秒）に対応しています。

  • dynamicプロパティは、ページが静的に生成されておらず、プリフェッチされていない（つまり、prefetch=でない）場合に使用されます
    • デフォルト：0秒（キャッシュされません）
  • staticプロパティは、ページが静的に生成されている場合、またはLinkのprefetchプロパティがtrueに設定されている場合、またはrouter.prefetchを呼び出す際に使用されます
    • デフォルト：5分

Good to know:

  • Loading boundaryは、この設定で定義されたstatic期間再利用可能とみなされます。
  • これは部分レンダリングに影響を与えません。共有レイアウトが毎回のナビゲーションで自動的に再フェッチされるわけではなく、変化するページセグメントのみです。
  • レイアウトシフトを防ぎ、ブラウザのスクロール位置が失われるのを防ぐために、戻る/進むキャッシュの動作を変更しません。

Client Router Cacheについてさらに知るにはこちらをご覧ください。

バージョン履歴​

バージョン変更内容
v15.0.0dynamic staleTimesのデフォルトが30秒から0秒に変更されました。
v14.2.0実験的なstaleTimesが導入されました。