Cloudflare a lancé la version 1.0 de Vinext, un framework open source permettant d’exécuter des applications Next.js au-dessus de Vite, avec la possibilité de les déployer sur des plateformes telles que Cloudflare Workers, Netlify et AWS Lambda. Le projet vise les nouvelles applications et les projets existants, y compris ceux qui utilisent Pages Router ou App Router, plutôt que de limiter la prise en charge à l’architecture Next.js la plus récente.
Une compatibilité élargie avec les applications Next.js
Vinext est passé d’une expérience pilotée par l’intelligence artificielle qui a duré une semaine lors de son lancement en février à un framework dont Cloudflare affirme qu’il est utilisé en production avec des applications à fort trafic et dynamiques. L’entreprise indique que sa compatibilité avec la plupart des fonctionnalités demandées par les clients dépasse 99 %, tout en continuant à tester le comportement réel des applications, et pas seulement à simuler des interfaces de programmation portant les mêmes noms.
La version prend en charge les architectures App Router et Pages Router, ainsi que les applications hybrides, les composants React côté serveur, les actions serveur, les routes API, les gestionnaires de routes, les intergiciels et la navigation côté client. Elle couvre également le rendu des pages côté serveur, la régénération incrémentielle des pages (ISR), l’exportation vers des ressources statiques, ainsi que la revalidation en arrière-plan ou à la demande.
Qu’est-ce qui change concrètement ?
Vinext unifie les fonctionnalités de mise en cache entre les deux architectures et les environnements d’exécution pris en charge, avec une prise en charge supplémentaire de Workers Cache. Il fournit également un traçage compatible avec Next.js, permettant de conserver les configurations OpenTelemetry et Sentry actuelles, et s’intègre sur Cloudflare Workers aux outils de surveillance natifs de Workers.
La version ajoute une prise en charge directe de l’environnement workerd pendant le développement et en production, avec un accès à des liaisons Cloudflare telles que l’optimisation des images et Hyperdrive. En revanche, la prise en charge du routage use cache associé à Cache Components reste limitée ; Cloudflare précise que la priorité actuelle porte sur les fonctionnalités fondamentales du framework dont dépendent les applications en production.
Préchauffage du cache avant le lancement
Vinext 1.0 propose de rendre au préalable les pages des architectures App Router et Pages Router pendant le processus de build, puis de les servir via ISR et de les invalider en fonction du chemin ou de la balise. Il ajoute toutefois une option différente pour les applications contenant des dizaines ou des centaines de milliers d’URL : déplacer une partie du rendu préalable depuis la machine de build vers le réseau Cloudflare.
La fonctionnalité de cache warming utilise les indicateurs habituels de Next.js pour déterminer les pages à préparer, et peut également identifier les pages à fort trafic. Avant de basculer la nouvelle version vers le trafic de production, Cloudflare déploie une version Worker à zéro pour cent du trafic, puis demande les pages depuis cette version afin de remplir le cache ; une fois le processus terminé, le déploiement peut être promu. Cela réduit l’attente liée au build séquentiel des pages peu visitées, mais dépend en pratique d’un déploiement sur Cloudflare lorsque cette fonctionnalité est utilisée.
Tests et parcours de migration
Cloudflare affirme que le projet repose sur des milliers de tests couvrant le comportement du framework, les serveurs en modes développement et production, ainsi que les cibles de déploiement sur Node.js et Cloudflare Workers. La suite complète de tests de Next.js est également exécutée chaque nuit sur Vinext afin de détecter les régressions dues aux changements en amont. Le processus de migration comprend deux commandes permettant de vérifier la compatibilité du projet et de configurer Vite ainsi que le déploiement, tout en conservant la structure antérieure du projet Next.js : npx vinext check, puis npx vinext init.
Vinext est disponible pour les nouveaux projets et les projets existants, et peut être déployé sur Cloudflare Workers avec préchauffage du cache à l’aide de la commande npx @vinext/cloudflare deploy --warm-cache. La matrice de compatibilité et la prise en charge incomplète de certaines fonctionnalités, telles que Cache Components, restent des points que les équipes doivent examiner avant d’adopter la migration dans des applications complexes.