Vercel ha rilasciato Next.js 16.3, portando Turbopack e il Partial Prerendering fuori dalla sezione sperimentale e rendendoli pronti per la produzione. L'aggiornamento promette build da due a cinque volte più veloci per le applicazioni di medie dimensioni e velocità di caricamento delle pagine che riducono il Time to Interactive del 40-60% — un incremento che qualsiasi team impegnato nel rilascio rapido di funzionalità noterà.

Perché il cambiamento è importante ora

Next.js si è appoggiato a lungo a Webpack, un bundler JavaScript scritto in JavaScript, sia per le build di sviluppo che di produzione. Nell'ultimo anno, il team di Vercel ha perfezionato Turbopack, un sostituto basato su Rust che riduce l'uso della memoria e velocizza le build. Allo stesso tempo, hanno testato il Partial Prerendering (PPR) come modo per combinare l'HTML statico con contenuti dinamici generati al volo, ma gli sviluppatori dovevano considerarlo un "esperimento opzionale". Promuovendoli entrambi come stabili, Vercel offre ai team di produzione un aggiornamento delle prestazioni pronto all'uso, senza i soliti tentativi ed errori.

Turbopack diventa stabile

  • Velocità: Le build di produzione su repository di medie dimensioni ora sono da due a cinque volte più veloci.
  • Memoria: Riduce la pressione sulla memoria nei codebase più grandi.
  • Attivazione: Aggiungi turbo: true a next.config.js e il gioco è fatto.

Il compromesso è un ambiente più rigoroso. Turbopack richiede Node 18.17 o versioni successive, e qualsiasi plugin Webpack personalizzato su cui i progetti fanno affidamento non funzionerà con Turbopack. I team con pipeline di plugin estese devono sottoporre a revisione o riscrivere tali estensioni prima di attivare la funzione.

Server Actions: un'esperienza più fluida

Le Server Actions — funzioni che vengono eseguite sul server ma chiamate dal client — godono ora di un'integrazione TypeScript più stretta. Il compilatore inferisce i tipi automaticamente, permettendo agli sviluppatori di eliminare le annotazioni dei tipi scritte a mano. Comprendono inoltre gli oggetti annidati e gli schemi Zod end-to-end, riducendo gli errori di mismatch a runtime. Le nuove convenzioni del file system rendono esplicita la risoluzione delle action, aiutando gli sviluppatori a evitare bug sottili causati da import ambigui.

Il Partial Prerendering (PPR) è pronto per la produzione

Il PPR consente a una singola pagina di servire HTML statico per le parti che non cambiano mai, mentre idrata separatamente le sezioni dinamiche. Il markup statico viene visualizzato istantaneamente; un fetch in background porta poi in vita i componenti interattivi. Questo approccio migliora il Time to Interactive (TTI) del 40–60%.

Implementare il PPR è semplice: contrassegna le porzioni statiche con l'attuale API di generazione statica e lascia che le parti dinamiche passino al rendering lato client. Poiché l'HTML statico arriva come un documento completo, il browser può iniziare il rendering prima che venga eseguito qualsiasi JavaScript, aumentando le prestazioni percepite su reti lente.

Altre modifiche degne di nota

  • Ottimizzazione delle immagini: fetchPriority può ora essere impostato sulle immagini LCP (Largest Contentful Paint), garantendo che il browser scarichi per primo l'immagine hero.
  • Gestione dei font: next/font esegue automaticamente il subsetting dei caratteri, riducendo la dimensione del payload senza configurazioni extra.
  • Middleware: Il motore di matching è stato riscritto in Rust, offrendo controlli delle rotte più veloci. I middleware possono anche restituire risposte HTML complete, aprendo la strada alle pagine renderizzate all'edge.

Passaggi immediati per i team

  1. Attiva Turbopack in fase di sviluppo; funziona allo stesso modo in produzione una volta impostato il flag turbo.
  2. Aggiorna Node alla versione 20 o superiore.
  3. Revisiona le Server Actions per sfruttare i vantaggi dell'inferenza dei tipi; rimuovi eventuali annotazioni manuali che ora sono ridondanti.
  4. Avvia un progetto pilota con il Partial Prerendering su una singola rotta ad alto traffico per misurare i miglioramenti del TTI prima di estenderlo a tutto il sito.

Avvertenze e controargomentazioni

I guadagni in termini di prestazioni dipendono dal rispetto dei nuovi requisiti di runtime. I progetti bloccati su versioni di Node più vecchie o pesantemente dipendenti da plugin Webpack personalizzati incontreranno difficoltà.

In sintesi: Next.js 16.3 mette a disposizione degli sviluppatori un bundler di livello produzione basato su Rust e un metodo collaudato per combinare contenuti statici e dinamici. Adotta subito i nuovi standard predefiniti, risolvi i problemi di compatibilità e vedrai le build terminare più velocemente e le pagine diventare sensibilmente più reattive per gli utenti finali.