React 19.2 est sorti

Date de sortie : 1er octobre 2025

Annonce officielle : React 19.2

React 19.2 apporte plusieurs APIs attendues depuis longtemps, dont useEffectEvent et le composant Activity, et ouvre la voie au partial prerendering pour les Server Components.

Les nouveautés principales

Le composant Activity

Activity découpe l’application en zones qu’on peut activer ou désactiver sans détruire leur état :

// Avant : démontage complet du composant
{isVisible && <Page />}

// Après : masquage avec préservation d'état
<Activity mode={isVisible ? 'visible' : 'hidden'}>
  <Page />
</Activity>

En mode hidden, React masque les enfants, démonte les effets et repousse les mises à jour. Utile pour pré-rendre des sections vers lesquelles l’utilisateur pourrait naviguer, ou pour garder l’état d’une section qu’on vient de quitter.

useEffectEvent

Sépare la logique événementielle des dépendances réactives d’un effet :

function ChatRoom({ roomId, theme }) {
  const onConnected = useEffectEvent(() => {
    showNotification('Connecté', theme);
  });

  useEffect(() => {
    const connection = createConnection(serverUrl, roomId);
    connection.on('connected', onConnected);
    connection.connect();
    return () => connection.disconnect();
  }, [roomId]); // plus besoin de theme ici
}

Fini les re-exécutions inutiles d’effets à cause de dépendances non essentielles.

Performance Tracks dans Chrome DevTools

Deux pistes personnalisées apparaissent dans le profiler Chrome :

• Scheduler track : priorisation du travail React (blocking, transition, etc.)
• Components track : timing de rendu et d’exécution des effets par composant
• 
  

cacheSignal pour Server Components

Permet de savoir quand la durée de vie de cache() se termine, pour nettoyer proprement :

import { cache, cacheSignal } from 'react';
const dedupedFetch = cache(fetch);

async function Component() {
  await dedupedFetch(url, { signal: cacheSignal() });
}

Partial prerendering

Pré-rendre la partie statique, reprendre avec la partie dynamique plus tard :

const { prelude, postponed } = await prerender(<App />, {
  signal: controller.signal,
});

const resumeStream = await resume(<App />, postponed);

Autres améliorations

• eslint-plugin-react-hooks v6
• Diverses optimisations côté React DOM

À retenir

Les deux ajouts les plus impactants au quotidien sont useEffectEvent (qui règle un vrai problème d’ergonomie sur useEffect) et Activity (qui change la façon de penser les transitions d’état). Les Performance Tracks Chrome aident aussi à comprendre où le temps part vraiment dans une application React.