Next.js uses caching to handle performance-intensive operations

Jun 29, 2024#Next.js142

AI Translation

This post is translated from Chinese into English through AI.View Original

AI-generated summary

Using caching is important for improving performance in applications with resource-intensive data operations. The unstable_cache function in Next.js can be used to cache data and retrieve it if it is not already cached. It is recommended to only cache public data and not data that requires authentication. The unstable_cache API may change in future versions of Next.js.

If your application has highly performance-intensive data operations, such as complex database queries or API requests, using caching to improve performance is very important.

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

unstable_cache returns a function to handle cached data. If the data is not in the cache, it will call the data request function passed in to fetch the data, cache the retrieved data, and return it.

Note: Do not cache data that requires authentication. A good practice is to only cache public data.

unstable_cache is an unstable API that may change in future versions. For specific usage, refer to the official documentation.

Next.js Version: v14.0.0