Partial Prerendering

Définition

Rendu qui combine une coquille statique servie depuis le CDN et des « trous » dynamiques remplis en streaming via Suspense. Dans Next.js 16 (21 octobre 2025), le flag expérimental.ppr a été supprimé : le PPR est intégré au modèle « Cache Components » (cacheComponents: true, directive 'use cache'). Côté React, les API prerender / résume / resumeAndPrerender de react-dom (React 19.2, 1er octobre 2025) fournissent la brique bas niveau.

Analogie

Comme un journal avec des encarts pub personnalises : le journal est imprime d'avance, mais les pubs changent par lecteur.

Exemple de code

// next.config.ts
export default { cacheComponents: true };

// app/product/[id]/page.tsx
export default async function Page({ params }) {
  const { id } = await params;
  return (
    <>
      <ProductInfo id={id} />          {/* 'use cache' => coquille statique */}
      <Suspense fallback={<CartSkeleton />}>
        <Cart />                        {/* dynamique, streamé */}
      </Suspense>
    </>
  );
}

Cas d'usage

Page e-commerce : en-tête, navigation et fiche produit pré-rendus ; panier et prix personnalisés streamés à la requête.

Anti-pattern

Termes liés

Sources

• nextjs.org/blog/next-16
• nextjs.org/docs/app/api-reference/directives/use-cache
• react.dev/blog/2025/10/01/react-19-2