基本動作

• デフォルト設定: fetchリクエストは永続的にキャッシュされる
• 重複排除: 同じURLとオプションを持つリクエストは自動的に重複排除される
• 静的レンダリング: データフェッチを含むルートはデフォルトで静的にレンダリングされる

キャッシュ制御オプション

// デフォルト: 永続キャッシュ
fetch('https://api.example.com/data')

// キャッシュ無効化
fetch('https://api.example.com/data', { cache: 'no-store' })

// 再検証間隔設定（10秒ごと）
fetch('https://api.example.com/data', { next: { revalidate: 10 } })

// タグベース再検証
fetch('https://api.example.com/data', { next: { tags: ['tag-name'] } })

再検証方法

1. 時間ベース再検証

   • next: { revalidate: 秒数 } で指定した間隔で自動再検証

2. オンデマンド再検証

   • revalidatePath('/path') - 特定のパスのキャッシュを再検証
   • revalidateTag('tag-name') - 特定のタグのキャッシュを再検証

3. ルートハンドラーでの再検証

   • フォーム送信などのイベント後にデータを再検証

実装パターン例

// 常に最新データを取得（キャッシュなし）
export async function getDynamicData() {
  return fetch('https://api.example.com/dynamic-data', { cache: 'no-store' });
}

// 定期的に更新（1時間ごと）
export async function getSemiDynamicData() {
  return fetch('https://api.example.com/semi-dynamic', { 
    next: { revalidate: 3600 } 
  });
}

// タグベース再検証用
export async function getTaggedData() {
  return fetch('https://api.example.com/tagged-data', { 
    next: { tags: ['my-data'] } 
  });
}

// Server Actionでの再検証
'use server'
import { revalidateTag } from 'next/cache';

export async function updateData(data) {
  await saveData(data);
  revalidateTag('my-data');
}

ユースケース別推奨設定

• 頻繁に変更されるデータ: cache: 'no-store'
• 定期的に更新されるデータ: next: { revalidate: 秒数 }
• 更新イベントがあるデータ: next: { tags: ['タグ名'] } + revalidateTag()
• 静的データ: デフォルト（キャッシュオプションなし）