Les nouveautés de Next.js 15 qui changent tout

Introduction

Next.js 15 marque une étape majeure dans l'évolution du framework. Avec l'intégration de React 19, Turbopack enfin stable, et de nombreuses optimisations de performance, cette version redéfinit les standards du développement web moderne.

Les nouveautés majeures

1. React 19 intégré

Next.js 15 est le premier framework majeur à intégrer React 19, apportant :

• Actions : Simplification de la gestion des mutations de données
• use() : Nouvelle façon de consommer les promesses et contextes
• Optimistic updates : Mises à jour optimistes natives
• Document metadata : Gestion native des meta tags

// Exemple d'action serveur avec React 19
async function submitForm(formData: FormData) {
  'use server'
  const name = formData.get('name')
  await saveToDatabase({ name })
  revalidatePath('/users')
}

2. Turbopack stable

Après des années de développement, Turbopack est enfin stable :

• Compilation 10x plus rapide que Webpack
• Hot Module Replacement quasi instantané
• Meilleure gestion de la mémoire
• Support complet de tous les plugins Next.js

3. Partial Prerendering (PPR)

Le PPR permet de combiner contenu statique et dynamique sur une même page :

export const experimental_ppr = true

export default async function Page() {
  return (
    <main>
      {/* Partie statique - générée au build */}
      <Header />
      <Hero />

      {/* Partie dynamique - générée à la demande */}
      <Suspense fallback={<Loading />}>
        <DynamicContent />
      </Suspense>
    </main>
  )
}

Améliorations de performance

Caching amélioré

Le nouveau système de cache offre un contrôle granulaire :

// Cache par défaut désactivé pour fetch
const data = await fetch(url) // no-store par défaut

// Opt-in pour le cache
const cachedData = await fetch(url, { cache: 'force-cache' })

// Cache avec revalidation
const timedData = await fetch(url, {
  next: { revalidate: 3600 }
})

Optimisation des images

Le composant Image bénéficie de nouvelles optimisations :

• Détection automatique du format optimal (AVIF, WebP)
• Lazy loading amélioré
• Placeholder blur automatique

Migration depuis Next.js 14

La migration est relativement simple grâce au codemod fourni :

npx @next/codemod@latest upgrade

Points d'attention

1. fetch() ne cache plus par défaut - Vérifiez vos appels API
2. Route handlers - Comportement GET modifié
3. Middleware - Nouvelles options de configuration

Conclusion

Next.js 15 représente une évolution majeure qui simplifie le développement tout en améliorant significativement les performances. L'intégration de React 19 et Turbopack stable en font le choix évident pour tout nouveau projet en 2024.

Ressources

• Documentation officielle
• Guide de migration
• Blog Next.js