unstable_cache

注意: このAPIは安定版になった時点でuse cacheに置き換えられる予定です。

unstable_cacheを使用すると、データベースクエリなどの処理コストの高い操作の結果をキャッシュし、複数のリクエスト間で再利用できます。

import { getUser } from './data';
import { unstable_cache } from 'next/cache';
 
const getCachedUser = unstable_cache(
  async (id) => getUser(id),
  ['my-app-user']
);
 
export default async function Component({ userID }) {
  const user = await getCachedUser(userID);
  ...
}

補足:

• キャッシュスコープ内でheadersやcookiesなどの動的データソースにアクセスすることはサポートされていません。キャッシュされた関数内でこのようなデータが必要な場合は、キャッシュされた関数の外部でheadersにアクセスし、必要な動的データを引数として渡してください。
• このAPIはNext.jsの組み込みのデータキャッシュを使用して、リクエストやデプロイメント間で結果を保持します。

警告: このAPIは不安定であり、将来変更される可能性があります。このAPIが安定化した際には、必要に応じて移行ドキュメントとコードモッドを提供します。

パラメータ

const data = unstable_cache(fetchData, keyParts, options)()

• fetchData: キャッシュしたいデータを取得する非同期関数です。Promiseを返す関数である必要があります。
• keyParts: キャッシュを識別するための追加のキー配列です。デフォルトでは、unstable_cacheは引数と関数の文字列化されたバージョンをキャッシュキーとして使用します。ほとんどの場合、これはオプションです。パラメータとして渡さずに外部変数を使用する場合にのみ使用する必要があります。ただし、パラメータとして渡さない場合は、関数内で使用されるクロージャを追加することが重要です。
• options: キャッシュの動作を制御するオブジェクトです。次のプロパティを含めることができます：
  • tags: キャッシュの無効化を制御するために使用できるタグの配列です。Next.jsはこれを関数の一意識別には使用しません。
  • revalidate: キャッシュを再検証するまでの秒数です。省略するかfalseを渡すと、一致するrevalidateTag()またはrevalidatePath()メソッドが呼び出されるまで無期限にキャッシュされます。

戻り値

unstable_cacheは関数を返し、その関数が呼び出されると、キャッシュされたデータに解決されるPromiseを返します。データがキャッシュに存在しない場合、提供された関数が呼び出され、その結果がキャッシュされて返されます。

例

import { unstable_cache } from 'next/cache'
 
export default async function Page({
  params,
}: {
  params: Promise<{ userId: string }>
}) {
  const userId = (await params).userId
  const getCachedUser = unstable_cache(
    async () => {
      return { id: userId }
    },
    [userId], // ユーザーIDをキャッシュキーに追加
    {
      tags: ['users'],
      revalidate: 60,
    }
  )
 
  //...
}

バージョン履歴