cacheComponents

cacheComponents フラグは Next.js の機能で、App Router のデータ取得操作を事前レンダリングから除外しますが、明示的にキャッシュされている場合を除きます。これは Server Components のダイナミックなデータ取得のパフォーマンス最適化に役立ちます。

アプリケーションが事前レンダリングされたキャッシュから提供するのではなく、ランタイム中に新鮮なデータ取得を必要とする場合に有用です。

use cache と組み合わせて使用することが想定されています。これにより、use cache でページ、関数、またはコンポーネント レベルでアプリケーションの特定の部分をキャッシュ対象として定義しない限り、データ取得はランタイムでデフォルトで実行されます。

使用方法

cacheComponents フラグを有効にするには、next.config.ts ファイルで true に設定します：

import type { NextConfig } from 'next'
 
const nextConfig: NextConfig = {
  cacheComponents: true,
}
 
export default nextConfig

cacheComponents が有効な場合、以下のキャッシュ関数と設定を使用できます：

• use cache ディレクティブ
• use cache での cacheLife 関数
• cacheTag 関数

注意事項

• cacheComponents はランタイム中に新鮮なデータ取得を確保することでパフォーマンスを最適化できますが、事前レンダリングされたコンテンツから提供する場合と比較して、追加のレイテンシが発生する可能性があります。

バージョン履歴