React v19 - Actions, Server Components, améliorations des erreurs d’hydratation, prise en charge des métadonnées du document, etc.

Nouvelles API et fonctionnalités

• Actions : gèrent automatiquement les modifications de données et les mises à jour d’état. Les états d’attente, les erreurs et les optimistic updates sont aussi gérés automatiquement
• useActionState : nouveau hook permettant de traiter simplement les cas d’usage courants des Actions
• API use : permet de lire des promesses et le contexte pendant le rendu
• useOptimistic : facilite l’implémentation des mises à jour d’UI optimistes pendant les requêtes asynchrones
• ref comme prop : permet d’utiliser directement la prop ref dans les composants fonctionnels (forwardRef n’est plus nécessaire)
• <Context> comme Provider : permet d’utiliser directement <Context> à la place de <Context.Provider>

Gestion du document et des ressources

• Prise en charge des métadonnées : permet d’utiliser directement les balises <title>, <link> et <meta> dans les composants
• Prise en charge des feuilles de style : chargement des feuilles de style et gestion des priorités depuis les composants
• Prise en charge des scripts asynchrones : permet de rendre des scripts asynchrones n’importe où dans l’arbre de composants
• Préchargement des ressources : fournit les API prefetchDNS, preconnect, preload et preinit pour optimiser les performances

Améliorations

• Prise en charge des custom elements : ajout d’une prise en charge complète des custom elements
• Amélioration de la gestion des erreurs : suppression des erreurs dupliquées et ajout d’options de gestion des erreurs
• Compatibilité avec les scripts/extensions tiers : amélioration du traitement des contenus tiers pendant l’hydratation
• Amélioration des erreurs d’hydratation : messages d’erreur plus clairs et meilleures informations de débogage

Server Components

• Server Components stabilisés : toutes les fonctionnalités de Server Components du canal Canary sont incluses dans React 19
• Server Actions : permet d’appeler des fonctions serveur depuis les composants clients

Divers

• Valeur initiale de useDeferredValue : ajout d’une option de valeur initiale à useDeferredValue
• Fonction de cleanup pour les ref : un callback ref peut désormais renvoyer une fonction de cleanup
• Nouvelles API statiques : ajout des API prerender et prerenderToNodeStream

[carnoxen]

Dans cette version 19, le fonctionnement controversé de <Suspense> a été redéfini. Jusqu’ici, lorsqu’un composant était mis sous Suspense, React continuait le rendu jusqu’au composant Suspense suivant avant de générer le fallback ; désormais, lorsqu’un composant est mis sous Suspense, le fallback est d’abord généré, puis le composant Suspense suivant est rendu.

Improvements to Suspense

En un mot, on peut considérer que le temps du premier rendu a été réduit. Heureusement que cela a été bien résolu.