Partial Prerendering (PPR) enables you to combine static and dynamic components together in the same route. Learn more about PPR.
Using Partial Prerendering Incremental Adoption (Version 15)In Next.js 15, you can incrementally adopt Partial Prerendering in layouts and pages by setting the ppr
option in next.config.js
to incremental
, and exporting the experimental_ppr
route config option at the top of the file:
import type { NextConfig } from 'next'
const nextConfig: NextConfig = {
experimental: {
ppr: 'incremental',
},
}
export default nextConfig
import { Suspense } from "react"
import { StaticComponent, DynamicComponent, Fallback } from "@/app/ui"
export const experimental_ppr = true
export default function Page() {
return {
<>
<StaticComponent />
<Suspense fallback={<Fallback />}>
<DynamicComponent />
</Suspense>
</>
};
}
Version ChangesGood to know:
- Routes that don't have
experimental_ppr
will default tofalse
and will not be prerendered using PPR. You need to explicitly opt-in to PPR for each route.experimental_ppr
will apply to all children of the route segment, including nested layouts and pages. You don't have to add it to every file, only the top segment of a route.- To disable PPR for children segments, you can set
experimental_ppr
tofalse
in the child segment.
v15.0.0
experimental incremental
value introduced v14.0.0
experimental ppr
introduced
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4