gt-react@11.0.0
Ernest McCarterVue d’ensemble
gt-react 11 est au cœur d’une mise à jour coordonnée de General Translation dans l’ensemble de nos bibliothèques React. gt-react, gt-next, @generaltranslation/react-core, gt-react-native et gt-tanstack-start sont tous passés à la version 11, aux côtés de gt-i18n 1.0 et de generaltranslation 9.0.
Cette version avait deux objectifs : faciliter l’extension du runtime i18n à davantage de frameworks et réduire la quantité de code General Translation livrée aux utilisateurs. Le résultat est une base partagée avec des étapes d’initialisation plus claires pour les applications exécutées uniquement dans le navigateur et celles avec rendu côté serveur.
Prise en charge native du Pages Router
Le changement le plus visible pour les utilisateurs dans la v11 est la prise en charge directe du Pages Router de Next.js dans gt-next. Auparavant, les applications utilisant le Pages Router devaient passer par gt-react. Elles peuvent désormais utiliser withGTServerSideProps() pour charger le paramètre régional et l’instantané de traduction, puis transmettre les deux à <GTProvider> dans _app.tsx.
La v11 ajoute également le routage des paramètres régionaux basé sur le middleware ainsi que withGTStaticProps() pour la génération statique.
Procédures de configuration mises à jour
- React SPAs - Initialisez
gt-reactavecinitializeGTSPA()avant le chargement de l’application. L’initialiseur résout en amont le paramètre régional et les traductions, de sorte que les SPA n’ont plus besoin d’un provider. Consultez le React SPA Quickstart. - React avec rendu côté serveur - Initialisez le runtime une seule fois, puis résolvez le paramètre régional de la requête et l’instantané de traduction sur le serveur. Transmettez
localeettranslationsà<GTProvider>pour une hydration synchrone. Consultez le Quickstart React avec rendu côté serveur. - TanStack Start - Résolvez le paramètre régional et l’instantané de traduction dans le loader racine, puis transmettez-les à
<GTProvider>. La sélection du paramètre régional est également conservée via le cookie de paramètre régional configuré. Consultez le TanStack Start Quickstart.
Un runtime plus léger et plus extensible
La version 11 supprime le code dont les applications clientes n’ont pas besoin et permet aux bundlers de mieux éliminer le code inutile dans les packages. Les chemins de traduction réservés au développement peuvent également être exclus des builds de production.
Dans notre benchmark Next.js en production, le JavaScript client attribué à GT est passé d’environ 251 KB à 108 KB, soit une baisse de 57,1 %. Cette mesure concerne la part de General Translation dans le bundle client, et non le bundle complet de l’application. Consultez les données sur les packages et les points d’entrée dans le Odysseus Bundle Size Tracker.
Cette même refactorisation nous donne aussi une base commune pour prendre en charge davantage de frameworks.
À l’avenir
Nous prévoyons de continuer à réduire le bundle côté client. Ensuite, nous voulons modulariser des fonctionnalités comme la traduction des dictionnaires et le hot reload en développement, afin que les applications n’embarquent que les fonctionnalités qu’elles utilisent.
Nous prévoyons également de nous appuyer davantage sur une architecture pilotée par le compilateur. Déplacer plus de travail vers le build plutôt que le runtime devrait réduire la quantité de JavaScript côté client ainsi que le surcoût à l’exécution, tout en facilitant la prise en charge d’un plus grand nombre de frameworks.