React 19 est sorti en décembre 2024, mais c'est l'année de correctifs et d'affinages qui a suivi,jusqu'à React 19.2,qui a rendu ses deux plus gros paris réellement exploitables en production : le React Compiler et les Server Components. Si vous comparez encore React 19 à React 18 fonctionnalité par fonctionnalité, le compiler est le changement qui transforme le plus votre façon d'écrire des composants au quotidien.

Le React Compiler : fini la mémoïsation manuelle

React 18 imposait useMemo, useCallback et React.memo aux développeurs pour éviter les re-renders inutiles. Le React Compiler analyse le code des composants à la compilation et insère cette mémoïsation automatiquement,aucun changement de comportement, les mêmes règles React, juste moins de renders gaspillés sans avoir à écrire le boilerplate.

// React 18 : mémoïsation manuelle pour éviter les re-renders
function ProductList({ products, onSelect }) {
  const sorted = useMemo(() => [...products].sort((a, b) => a.price - b.price), [products]);
  const handleSelect = useCallback((id) => onSelect(id), [onSelect]);

  return sorted.map((p) => <ProductRow key={p.id} product={p} onClick={handleSelect} />);
}

// React 19 + Compiler : le compiler insère la mémoïsation à votre place
function ProductList({ products, onSelect }) {
  const sorted = [...products].sort((a, b) => a.price - b.price);
  return sorted.map((p) => <ProductRow key={p.id} product={p} onClick={() => onSelect(p.id)} />);
}

Les Server Components comme pattern par défaut

Les React Server Components sont passés de "la fonctionnalité du App Router de Next.js" à un pattern largement adopté en 2026. Un Server Component se rend côté serveur, peut accéder directement à la base de données ou au système de fichiers, et n'envoie aucun JavaScript au client pour cette partie de l'arbre.

// Ce composant n'envoie jamais sa logique au navigateur
async function ProductPage({ params }) {
  const product = await db.products.findUnique({ where: { id: params.id } });

  return (
    <div>
      <h1>{product.name}</h1>
      <AddToCartButton productId={product.id} /> {/* composant client */}
    </div>
  );
}

Les métadonnées de document directement dans les composants

React peut désormais rendre les balises <title>, <meta> et <link> n'importe où dans l'arbre de composants et les remonte correctement dans le head du document,fini react-helmet ou la gestion manuelle du head pour des métadonnées SEO simples.

function ProductPage({ product }) {
  return (
    <article>
      <title>{product.name} | Ma Boutique</title>
      <meta name="description" content={product.shortDescription} />
      <h1>{product.name}</h1>
    </article>
  );
}

Ce qui a vraiment changé depuis React 18

• ✓Fini le useMemo/useCallback/React.memo manuel dans la plupart des composants,le compiler s'en charge
• ✓Les Server Components sont un pattern mainstream, plus une expérimentation réservée à Next.js
• ✓Les métadonnées SEO peuvent vivre à côté du composant qui possède la donnée
• ✓L'écosystème (React Native 0.86+) a suivi avec des DevTools alignés et le support edge-to-edge

Rien de tout ça n'impose de réécrire une app React 18 du jour au lendemain. Ajouter le plugin compiler, observer les avertissements ESLint, et migrer vers les Server Components là où ça a du sens,typiquement tout ce qui récupère de la donnée sans avoir besoin d'interactivité.