Skip to main content

部分预渲染(实验性)

部分预渲染是一项实验性功能,可能会发生变化。

¥Partial Prerendering is an experimental feature and subject to change.

部分预渲染是一项实验性功能,允许预渲染路由的静态部分,并从缓存中提供服务,并通过流式传输动态孔,所有这些都在单个 HTTP 请求中完成。

¥Partial Prerendering is an experimental feature that allows static portions of a route to be prerendered and served from the cache with dynamic holes streamed in, all in a single HTTP request.

Next.js 15 中提供了增量支持,允许你选择对特定路由和布局进行部分预渲染。

¥Incremental support is available in Next.js 15, allowing you to opt-in to Partial Prerendering for specific routes and layouts.

要启用部分预渲染,请将实验性的 ppr 标志设置为 incremental

¥To enable Partial Prerendering, set the experimental ppr flag to incremental:

/** @type {import('next').NextConfig} */
const nextConfig = {
experimental: {
ppr: 'incremental',
},
}

module.exports = nextConfig

选项

¥Options

  • incremental:允许你逐步选择布局和页面,并应与 experimental_ppr 路由配置选项一起使用。

    ¥incremental: Allows you to incrementally opt-in layouts and pages, and should be used with the experimental_ppr route config option.

  • true:为应用中的所有路由启用部分预渲染。

    ¥true: Enables Partial Prerendering for all routes in your application.

我们建议首先使用 incremental。一旦应用中的所有路由都启用了 PPR,你就可以安全地将 ppr 值设置为 true,并为整个应用和所有未来路由启用它。

¥We recommend using incremental first. Once all the routes in your application have PPR enabled, it’ll be considered safe for you to set the ppr value to true, and enable it for the entire app and all future routes.

很高兴知道:

¥Good to know:

  • 使用 incremental 时,没有 experimental_ppr 的路由将默认为 false,并且不会使用部分预渲染进行预渲染。你需要为每条路由明确选择加入部分预渲染。

    ¥When using incremental, routes that don't have experimental_ppr will default to false and will not be prerendered using Partial Prerendering. You need to explicitly opt-in to Partial Prerendering for each route.

  • 部分预渲染尚不适用于客户端导航。我们正在积极致力于此。

    ¥Partial Prerendering does not yet apply to client-side navigations. We are actively working on this.

  • 部分预渲染仅针对 Node.js 运行时 设计。当你可以立即提供静态 shell 时,不需要使用 Edge Runtime。

    ¥Partial Prerendering is designed for the Node.js runtime only. Using the Edge Runtime is not needed when you can instantly serve the static shell.

了解有关 Next.js 学习课程 中部分预渲染的更多信息。

¥Learn more about Partial Prerendering in the Next.js Learn course.