unstable_cache

Advertencia: Esta API será reemplazada por use cache cuando alcance estabilidad.

unstable_cache permite almacenar en caché los resultados de operaciones costosas, como consultas a bases de datos, y reutilizarlos en múltiples solicitudes.

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);
  ...
}

Es bueno saber:

• No se admite acceder a fuentes de datos dinámicas como headers o cookies dentro de un ámbito de caché. Si necesitas estos datos dentro de una función almacenada en caché, usa headers fuera de la función y pasa los datos dinámicos requeridos como argumento.
• Esta API utiliza la Caché de Datos integrada de Next.js para persistir el resultado entre solicitudes y despliegues.

Parámetros

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

• fetchData: Función asíncrona que obtiene los datos que deseas almacenar en caché. Debe ser una función que devuelva una Promise.
• keyParts: Array adicional de claves que añade más identificación a la caché. Por defecto, unstable_cache ya utiliza los argumentos y la versión stringificada de tu función como clave de caché. Es opcional en la mayoría de los casos; solo necesitas usarlo cuando empleas variables externas sin pasarlas como parámetros. Sin embargo, es importante añadir los cierres (closures) utilizados dentro de la función si no los pasas como parámetros.
• options: Objeto que controla el comportamiento de la caché. Puede contener las siguientes propiedades:
  • tags: Array de etiquetas que pueden usarse para controlar la invalidación de la caché. Next.js no usará esto para identificar de forma única la función.
  • revalidate: Número de segundos después de los cuales la caché debe revalidarse. Omite o pasa false para almacenar en caché indefinidamente o hasta que se llamen los métodos revalidateTag() o revalidatePath() correspondientes.

Retorna

unstable_cache devuelve una función que, al invocarse, retorna una Promise que se resuelve con los datos almacenados en caché. Si los datos no están en la caché, se invocará la función proporcionada, y su resultado se almacenará en caché y se devolverá.

Ejemplo

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], // añade el ID de usuario a la clave de caché
    {
      tags: ['users'],
      revalidate: 60,
    }
  )

  //...
}

Historial de Versiones