部分预渲染(实验性)
部分预渲染是一项实验性功能,可能会发生变化。
¥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 theexperimental_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 haveexperimental_ppr
will default tofalse
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.