gt-react@11.0.0
Ernest McCarterPanoramica
gt-react 11 è al centro di un rilascio coordinato di General Translation che coinvolge le nostre librerie React. gt-react, gt-next, @generaltranslation/react-core, gt-react-native e gt-tanstack-start sono tutti passati alla versione 11, insieme a gt-i18n 1.0 e generaltranslation 9.0.
Questo rilascio aveva due obiettivi: rendere il runtime i18n più facile da estendere ad altri framework e ridurre la quantità di codice di General Translation distribuita agli utenti. Il risultato è una base condivisa con procedure di setup più chiare per le app eseguite solo nel browser e per quelle con rendering lato server.
Supporto nativo per Pages Router
La modifica più importante visibile agli utenti nella v11 è il supporto diretto per il Pages Router di Next.js in gt-next. In precedenza, le app con Pages Router dovevano usare gt-react. Ora possono usare withGTServerSideProps() per caricare l'impostazione regionale e lo snapshot delle traduzioni, quindi passarli entrambi a <GTProvider> in _app.tsx.
La v11 introduce anche il routing delle impostazioni regionali basato su middleware e withGTStaticProps() per la generazione statica.
Flussi di setup aggiornati
- SPA React - Inizializza
gt-reactconinitializeGTSPA()prima del caricamento dell'app. L'inizializzatore risolve in anticipo l'impostazione regionale e le traduzioni, quindi le SPA non hanno più bisogno di un provider. Vedi React SPA Quickstart. - React con rendering lato server - Inizializza il runtime una sola volta, quindi risolvi sul server l'impostazione regionale della richiesta e lo snapshot delle traduzioni. Passa sia
localesiatranslationsa<GTProvider>per un'idratazione sincrona. Vedi server-rendered React Quickstart. - TanStack Start - Risolvi l'impostazione regionale e lo snapshot delle traduzioni nel loader root, quindi passali entrambi a
<GTProvider>. La selezione dell'impostazione regionale viene mantenuta anche tramite il cookie dell'impostazione regionale configurato. Vedi TanStack Start Quickstart.
Un runtime più piccolo e più estensibile
La versione 11 rimuove il codice di cui le app client non hanno bisogno e rende i pacchetti più facili da ottimizzare con il tree-shaking da parte dei bundler. Anche i percorsi di traduzione usati solo in sviluppo possono essere esclusi dalle build di produzione.
Nel nostro benchmark di produzione per Next.js, il codice JavaScript client attribuito a GT è sceso da circa 251 KB a 108 KB: una riduzione del 57,1%. Questa misura riguarda la porzione di General Translation del bundle client, non l'intero bundle dell'applicazione. Esplora i dati su pacchetti ed entry point in Odysseus Bundle Size Tracker.
Lo stesso refactoring ci fornisce una base comune per supportare più framework.
In futuro
Prevediamo di continuare a ridurre il bundle lato client. Il prossimo passo sarà modularizzare funzionalità come la traduzione del dizionario e l'hot reload in sviluppo, in modo che le app includano solo le funzionalità che utilizzano.
Prevediamo inoltre di affidarci maggiormente a un'architettura basata su compilatore. Spostare più lavoro al build time anziché al runtime dovrebbe ridurre il JavaScript lato client e il sovraccarico a runtime, semplificando al tempo stesso il supporto di un numero maggiore di framework.