diff --git a/docs/02-app/01-building-your-application/02-data-fetching/01-fetching.mdx b/docs/02-app/01-building-your-application/02-data-fetching/01-fetching.mdx index c3270ed0080a2..ad06a4c4ed0e1 100644 --- a/docs/02-app/01-building-your-application/02-data-fetching/01-fetching.mdx +++ b/docs/02-app/01-building-your-application/02-data-fetching/01-fetching.mdx @@ -51,7 +51,7 @@ This example demonstrates a basic server-side data fetch using the `fetch` API i - [`fetch`](/docs/app/api-reference/functions/fetch) - React [`cache`](https://react.dev/reference/react/cache) -- Next.js [`unstable_cache`](/docs/app/api-reference/functions/unstable_cache) +- Next.js [`unstable_cache`](/docs/app/api-reference/legacy-apis/unstable_cache) ## Examples diff --git a/docs/02-app/01-building-your-application/03-rendering/01-server-components.mdx b/docs/02-app/01-building-your-application/03-rendering/01-server-components.mdx index f5d341d0c1327..bf0a7bc820b6c 100644 --- a/docs/02-app/01-building-your-application/03-rendering/01-server-components.mdx +++ b/docs/02-app/01-building-your-application/03-rendering/01-server-components.mdx @@ -104,7 +104,7 @@ Dynamic APIs rely on information that can only be known at request time (and not - [`connection`](/docs/app/api-reference/functions/connection) - [`draftMode`](/docs/app/api-reference/functions/draft-mode) - [`searchParams` prop](/docs/app/api-reference/file-conventions/page#searchparams-optional) -- [`unstable_noStore`](/docs/app/api-reference/functions/unstable_noStore) +- [`unstable_noStore`](/docs/app/api-reference/legacy-apis/unstable_noStore) - [`unstable_after`](/docs/app/api-reference/functions/unstable_after) ### Streaming diff --git a/docs/02-app/01-building-your-application/04-caching/index.mdx b/docs/02-app/01-building-your-application/04-caching/index.mdx index 9fc363c2a6105..bfa2cc8064847 100644 --- a/docs/02-app/01-building-your-application/04-caching/index.mdx +++ b/docs/02-app/01-building-your-application/04-caching/index.mdx @@ -389,7 +389,7 @@ The following table provides an overview of how different Next.js APIs affect ca | [`headers`, `searchParams`](#dynamic-apis) | | Opt out | | | | [`generateStaticParams`](#generatestaticparams) | | Cache | | | | [`React.cache`](#react-cache-function) | | | | Cache | -| [`unstable_cache`](/docs/app/api-reference/functions/unstable_cache) | | | Cache | | +| [`unstable_cache`](/docs/app/api-reference/legacy-apis/unstable_cache) | | | Cache | | ### `` @@ -451,7 +451,7 @@ See the [`fetch` API reference](/docs/app/api-reference/functions/fetch) for mor Next.js has a cache tagging system for fine-grained data caching and revalidation. -1. When using `fetch` or [`unstable_cache`](/docs/app/api-reference/functions/unstable_cache), you have the option to tag cache entries with one or more tags. +1. When using `fetch` or [`unstable_cache`](/docs/app/api-reference/legacy-apis/unstable_cache), you have the option to tag cache entries with one or more tags. 2. Then, you can call `revalidateTag` to purge the cache entries associated with that tag. For example, you can set a tag when fetching data: diff --git a/docs/02-app/01-building-your-application/10-deploying/01-production-checklist.mdx b/docs/02-app/01-building-your-application/10-deploying/01-production-checklist.mdx index b20252c787f18..ad38d6f6cdf25 100644 --- a/docs/02-app/01-building-your-application/10-deploying/01-production-checklist.mdx +++ b/docs/02-app/01-building-your-application/10-deploying/01-production-checklist.mdx @@ -64,7 +64,7 @@ While building your application, we recommend using the following features to en - **[Route Handlers](/docs/app/building-your-application/routing/route-handlers):** Use Route Handlers to access your backend resources from Client Components. But do not call Route Handlers from Server Components to avoid an additional server request. - **[Streaming](/docs/app/building-your-application/routing/loading-ui-and-streaming):** Use Loading UI and React Suspense to progressively send UI from the server to the client, and prevent the whole route from blocking while data is being fetched. - **[Parallel Data Fetching](/docs/app/building-your-application/data-fetching/fetching#parallel-and-sequential-data-fetching):** Reduce network waterfalls by fetching data in parallel, where appropriate. Also, consider [preloading data](/docs/app/building-your-application/data-fetching/fetching#preloading-data) where appropriate. -- **[Data Caching](/docs/app/building-your-application/caching#data-cache):** Verify whether your data requests are being cached or not, and opt into caching, where appropriate. Ensure requests that don't use `fetch` are [cached](/docs/app/api-reference/functions/unstable_cache). +- **[Data Caching](/docs/app/building-your-application/caching#data-cache):** Verify whether your data requests are being cached or not, and opt into caching, where appropriate. Ensure requests that don't use `fetch` are [cached](/docs/app/api-reference/legacy-apis/unstable_cache). - **[Static Images](/docs/app/building-your-application/optimizing/static-assets):** Use the `public` directory to automatically cache your application's static assets, e.g. images. diff --git a/docs/02-app/02-api-reference/01-directives/use-cache.mdx b/docs/02-app/02-api-reference/01-directives/use-cache.mdx index e93d36e489164..3825ff2e13e84 100644 --- a/docs/02-app/02-api-reference/01-directives/use-cache.mdx +++ b/docs/02-app/02-api-reference/01-directives/use-cache.mdx @@ -10,7 +10,7 @@ related: - app/api-reference/next-config-js/cacheLife - app/api-reference/functions/cacheTag - app/api-reference/functions/revalidateTag - - app/api-reference/functions/unstable_cache + - app/api-reference/legacy-apis/unstable_cache --- The `use cache` directive designates a component, function, or file to be cached. It can be used at the top of a file to indicate that all functions in the file are cacheable, or inline at the top of a function to mark the function as cacheable. This is an experimental Next.js feature, and not a native React feature like `use client` or `use server`. @@ -35,7 +35,7 @@ Caching is a technique to improve the performance of web applications by storing To explicitly cache certain asynchronous operations and achieve static behavior, you can use the `use cache` directive. This allows you to optimize rendering performance by caching results from async data requests, while still enabling dynamic rendering when needed. -The `use cache` directive is an experimental feature that aims to replace the [`unstable_cache`](/docs/app/api-reference/functions/unstable_cache) function. Unlike `unstable_cache`, which is limited to caching JSON data and requires manual definition of revalidation periods and tags, `use cache` offers more flexibility. It allows you to cache a wider range of data, including anything that React Server Components (RSC) can serialize, as well as data-fetching outputs and component outputs. +The `use cache` directive is an experimental feature that aims to replace the [`unstable_cache`](/docs/app/api-reference/legacy-apis/unstable_cache) function. Unlike `unstable_cache`, which is limited to caching JSON data and requires manual definition of revalidation periods and tags, `use cache` offers more flexibility. It allows you to cache a wider range of data, including anything that React Server Components (RSC) can serialize, as well as data-fetching outputs and component outputs. Additionally, `use cache` automatically manages complexities by tracking both inputs and outputs, making it less likely for you to accidentally poison your cache. Since it serializes both inputs and outputs, you can avoid issues with incorrect cache retrieval. @@ -69,7 +69,7 @@ export async function getData() { ## Revalidating -By default when using the `use cache` directive Next.js sets a **[revalidation period](/docs/app/building-your-application/data-fetching/fetching-caching-and-revalidating#revalidating-data) of fifteen minutes** with a near infinite expiration duration, meaning it's suitable for content that doesn't need frequent updates. +By default when using the `use cache` directive Next.js sets a **[revalidation period](/docs/app/building-your-application/data-fetching/fetching#revalidating-cached-data) of fifteen minutes** with a near infinite expiration duration, meaning it's suitable for content that doesn't need frequent updates. While this may be useful for content you don't expect to change often, you can use the `cacheLife` and `cacheTag` APIs for more granular caching control: diff --git a/docs/02-app/02-api-reference/01-directives/use-client.mdx b/docs/02-app/02-api-reference/01-directives/use-client.mdx index 016358a0f6924..d728cdbd4b77d 100644 --- a/docs/02-app/02-api-reference/01-directives/use-client.mdx +++ b/docs/02-app/02-api-reference/01-directives/use-client.mdx @@ -3,8 +3,6 @@ title: use client description: Learn how to use the use client directive to render a component on the client. related: description: React documentation for use client. - links: - - https://react.dev/reference/rsc/use-client --- The `use client` directive designates a component to be rendered on the **client side** and should be used when creating interactive user interfaces (UI) that require client-side JavaScript capabilities, such as state management, event handling, and access to browser APIs. This is a React feature. diff --git a/docs/02-app/02-api-reference/01-directives/use-server.mdx b/docs/02-app/02-api-reference/01-directives/use-server.mdx index 8b428752171ba..974e3fa06aa05 100644 --- a/docs/02-app/02-api-reference/01-directives/use-server.mdx +++ b/docs/02-app/02-api-reference/01-directives/use-server.mdx @@ -3,8 +3,6 @@ title: use server description: Learn how to use the use server directive to execute code on the server. related: description: React documentation for use server. - links: - - https://react.dev/reference/rsc/use-server --- The `use server` directive designates a function or file to be executed on the **server side**. It can be used at the top of a file to indicate that all functions in the file are server-side, or inline at the top of a function to mark the function as a [Server Function](https://19.react.dev/reference/rsc/server-functions). This is a React feature. diff --git a/docs/02-app/02-api-reference/04-functions/connection.mdx b/docs/02-app/02-api-reference/04-functions/connection.mdx index cf4114218264c..717d1e2051e7c 100644 --- a/docs/02-app/02-api-reference/04-functions/connection.mdx +++ b/docs/02-app/02-api-reference/04-functions/connection.mdx @@ -47,7 +47,7 @@ function connection(): Promise ## Good to know -- `connection` replaces [`unstable_noStore`](/docs/app/api-reference/functions/unstable_noStore) to better align with the future of Next.js. +- `connection` replaces [`unstable_noStore`](/docs/app/api-reference/legacy-apis/unstable_noStore) to better align with the future of Next.js. - The function is only necessary when dynamic rendering is required and common Dynamic APIs are not used. ### Version History diff --git a/docs/02-app/02-api-reference/08-legacy-apis/unstable_noStore.mdx b/docs/02-app/02-api-reference/08-legacy-apis/unstable_noStore.mdx index d6f8aef38717a..2dfcf4813ae94 100644 --- a/docs/02-app/02-api-reference/08-legacy-apis/unstable_noStore.mdx +++ b/docs/02-app/02-api-reference/08-legacy-apis/unstable_noStore.mdx @@ -23,7 +23,7 @@ export default async function ServerComponent() { > - `unstable_noStore` is equivalent to `cache: 'no-store'` on a `fetch` > - `unstable_noStore` is preferred over `export const dynamic = 'force-dynamic'` as it is more granular and can be used on a per-component basis -- Using `unstable_noStore` inside [`unstable_cache`](/docs/app/api-reference/functions/unstable_cache) will not opt out of static generation. Instead, it will defer to the cache configuration to determine whether to cache the result or not. +- Using `unstable_noStore` inside [`unstable_cache`](/docs/app/api-reference/legacy-apis/unstable_cache) will not opt out of static generation. Instead, it will defer to the cache configuration to determine whether to cache the result or not. ## Usage diff --git a/errors/next-dynamic-api-wrong-context.mdx b/errors/next-dynamic-api-wrong-context.mdx index 30bdee997e6cd..794851ed190ad 100644 --- a/errors/next-dynamic-api-wrong-context.mdx +++ b/errors/next-dynamic-api-wrong-context.mdx @@ -39,5 +39,5 @@ export async function GET() { - [`headers()` function](https://nextjs.org/docs/app/api-reference/functions/headers) - [`cookies()` function](https://nextjs.org/docs/app/api-reference/functions/cookies) - [`draftMode()` function](https://nextjs.org/docs/app/api-reference/functions/draft-mode) -- [`unstable_noStore()` function](https://nextjs.org/docs/app/api-reference/functions/unstable_noStore) -- [`unstable_cache()` function](https://nextjs.org/docs/app/api-reference/functions/unstable_cache) +- [`unstable_noStore()` function](https://nextjs.org/docs/app/api-reference/legacy-apis/unstable_noStore) +- [`unstable_cache()` function](https://nextjs.org/docs/app/api-reference/legacy-apis/unstable_cache)