Skip to content
Tech AI Wire

React 19.3 arrive avec View Transitions et Fragment Refs

React 19.3 est sorti le 9 septembre 2026. View Transitions et Fragment Refs sont désormais stables, et la version ne comporte aucune rupture de compatibilité.

Par Tech AI Wire Team

3 min de lecture

XLinkedIn
The React 19.3 release post on react.dev, open at the View Transitions section.

En chiffres

pull requests behind the View Transitions work
47
pull requests behind Fragment Refs
26
contributors to the release
52

React 19.3 est là. L'équipe React a publié la version le 9 septembre 2026, en faisant passer au stade stable deux fonctionnalités longtemps expérimentales : View Transitions et Fragment Refs. Les notes de version sur GitHub créditent 52 contributeurs, avec 47 pull requests derrière View Transitions à elles seules et 26 derrière Fragment Refs.

Il n'y a aucune rupture de compatibilité. Chaque fonctionnalité ici est quelque chose que vous choisissez d'activer.

View Transitions, et quand elles se déclenchent vraiment

Le nouveau composant <ViewTransition> anime les éléments quand ils apparaissent, disparaissent, se déplacent ou changent de taille. Il passe pour cela par l'API View Transition du navigateur plutôt que par une animation en JavaScript.

La règle qui piège les gens, c'est de savoir quelles mises à jour sont animées. La documentation de React est explicite : « Les mises à jour non marquées comme Transitions ne déclenchent pas d'animations, car elles sont censées être urgentes et se refléter immédiatement dans l'interface. » Trois choses provoquent une animation. Une mise à jour d'état dans startTransition, un contenu révélé par Suspense ou une mise à jour issue de useDeferredValue.

Envelopper un composant dans <ViewTransition> puis appeler setState normalement ne produit donc aucune animation. C'est le comportement voulu, pas un bogue, et c'est la première chose à vérifier quand rien ne bouge.

This Week In React signale une API compagnon, addTransitionType, qui permet de « personnaliser l'animation directement depuis le code qui la déclenche ». Cela compte, parce que le même composant doit souvent s'animer différemment selon ce qui a causé le changement.

Une limite de plateforme est énoncée sans détour par l'équipe React : « Pour l'instant, <ViewTransition> ne fonctionne que dans le DOM. Nous travaillons à la prise en charge de React Native et d'autres plateformes. »

Fragment Refs suppriment la div enveloppante

Les Fragment Refs permettent d'attacher une ref à un <Fragment> et d'agir sur le groupe de nœuds DOM qu'il contient comme sur une seule unité.

Le problème résolu est familier. Quand vous avez besoin d'une prise sur plusieurs éléments frères, vous ajoutez normalement une <div> enveloppante pour y accrocher la ref. Cette enveloppe interfère ensuite avec le style et la mise en page autour d'elle. Les enfants de grid et de flex en sont les victimes habituelles.

Les notes de version sur GitHub décrivent le changement comme l'ajout de « Refs sur <Fragment /> pour prendre en charge un comportement de plateforme composable ». This Week In React présente le gain comme le déblocage de « nouveaux motifs de composition qui étaient auparavant difficiles ». Les usages pratiques sont l'écoute d'événements sur un groupe et la gestion du focus.

Les changements plus petits

ChangementCe qu'il fait
Transitions indépendantesLes Transitions « sont rendues indépendamment au lieu d'être enchevêtrées dans un rendu unique, si bien qu'une transition lente ne retient plus celles qui n'ont rien à voir »
browser() de react-domRenvoie « un usable qui lève une erreur pendant le rendu côté serveur et se résout dans le navigateur », ce qui exclut un sous-arbre du rendu serveur en déclenchant Suspense
Prise en charge des Trusted TypesPermet à React de coopérer avec une Content-Security-Policy exigeant des trusted types, pour empêcher les XSS basés sur le DOM
Context dans les Server Components<Context> peut être rendu directement depuis un module 'use client', sans composant provider d'emballage séparé

use(browser()) suit les règles normales de use. La documentation de React dit qu'il « peut être appelé dans une instruction conditionnelle ou après un retour anticipé », ce qui est inhabituel et délibéré.

Ce que cela signifie pour les développeurs

Mettez à jour pour la version elle-même, pas pour les animations. Sans rupture de compatibilité, 19.3 est une montée de version de routine, et les deux fonctionnalités phares sont purement additives.

Si vous adoptez View Transitions, prévoyez du temps pour la règle des Transitions plutôt que pour le CSS. L'essentiel de la confusion des premières adoptions viendra de mises à jour qui, discrètement, ne s'animent pas parce qu'elles n'ont jamais été marquées comme Transitions. Faites l'inventaire de l'endroit où vivent réellement vos mises à jour d'état avant d'envelopper quoi que ce soit.

Vérifiez aussi vos hypothèses sur la prise en charge des navigateurs. Tout cela repose sur une API du navigateur, pas sur une implémentation propre à React, donc votre plancher est ce que les navigateurs de vos utilisateurs embarquent. Ce plancher bouge plus vite qu'avant, maintenant que Chrome est passé à un rythme de sortie de deux semaines, mais il exclut toujours l'animation comme garantie. Traitez-la comme une amélioration qui se dégrade en absence d'animation.

Les Fragment Refs sont le changement le plus susceptible de rapporter discrètement. Si votre base de code traîne des <div> enveloppantes qui n'existent que pour porter une ref, chacune est candidate à la suppression. Les retirer efface aussi des contournements de mise en page qui n'ont jamais eu de rapport avec la mise en page.

Les équipes React Native ne tirent rien de la fonctionnalité phare de cette version. View Transitions ne fonctionne aujourd'hui que dans le DOM, et l'équipe React s'est engagée sur d'autres plateformes sans donner de date.

Sources

  1. React 19.3 - React
  2. Release 19.3.0 - GitHub
  3. This Week In React #296 - This Week In React

Articles liés