Menu

unstable_cache

バージョン15では、代わりに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);
  ...
}

補足:

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

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

パラメータ

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

戻り値

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

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

バージョン履歴

バージョン変更点
v14.0.0導入時期:unstable_cache