PPR (Partial Pre-Rendering) è una strategia di rendering di Next.js che combina gusci HTML pre-renderizzati statici con isole dinamiche in streaming, offrendo una rapida prima visualizzazione e freschezza per utente.
Introdotto in Next.js come experimental.ppr = "incremental" in Next.js 14 e progressivamente stabilizzato attraverso Next.js 15 e 16, PPR funziona pre-renderizzando le parti di una pagina che sono statiche (titolo, canonico, hreflang, JSON-LD, hero) e identificando i confini dinamici (badge del carrello, articoli recentemente visualizzati, raccomandazioni personalizzate) avvolti in <Suspense>. Il guscio statico viene trasmesso istantaneamente dalla cache edge; le isole dinamiche vengono trasmesse successivamente, spesso entro decine di millisecondi.
Per l'ecommerce, PPR è particolarmente prezioso perché il contenuto critico per la SEO (titolo, canonico, dati strutturati) si trova nel guscio statico e arriva prima di qualsiasi chiamata al database. Le isole dinamiche offrono l'esperienza per utente senza bloccare la superficie SEO.
PPR si abbina naturalmente ai Cache Components (cacheComponents: true) — i componenti scelgono di attivare la cache a livello di componente, e PPR compone le parti statiche e dinamiche in un flusso coerente.