● Next.js App Router の サーバーサイド fetch のキャッシュについて

● A. Next.js の fetch 関数を使用している場合（キャッシュが自動で有効になる）

この例では 3600秒（1時間）サーバーサイドでキャッシュが有効になります。

page.tsx

/**
 * Route Segment Config
 */
export const revalidate = 3600

export default async function Page() {
  fetch('https://...')

● B. fetch 以外の関数でデータ取得している場合の cache について

unstable_cache を使ってキャッシュ関数を合成することで、キャッシュに対応できるようになります。

公式: https://nextjs.org/docs/app/api-reference/functions/unstable_cache

page.tsx

/**
 * Route Segment Config
 */
export const revalidate = 3600

/**
 * cached Function
 */
const getUserCached = unstable_cache(
  (id:string) => { return getUser(id) } // データ取得関数をここに
  [keyParts],
)

export default async function Page() {
  const user = getUserCached('xxxxxxxx')

● Next.js App Router の Route Segment Config について

Route Segment Configは以下のデフォルト値を持ちます。

export const dynamic = 'auto'
export const dynamicParams = true
export const revalidate = false
export const fetchCache = 'auto'
export const runtime = 'nodejs'
export const preferredRegion = 'auto'
export const maxDuration = 5