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の組み込みデータキャッシュを使用して、リクエストやデプロイを跨いで結果を永続化します。

パラメータ

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
  const getCachedUser = unstable_cache(
    async () => {
      return { id: userId }
    },
    [userId], // ユーザーIDをキャッシュキーに追加
    {
      tags: ['users'],
      revalidate: 60,
    }
  )

  //...
}

import { unstable_cache } from 'next/cache';

export default async function Page({ params } }) {
  const { userId } = await params
  const getCachedUser = unstable_cache(
    async () => {
      return { id: userId };
    },
    [userId], // ユーザーIDをキャッシュキーに追加
    {
      tags: ["users"],
      revalidate: 60,
    }
  );

  //...
}

バージョン履歴