Cadres et outils - AWS Directives prescriptives

Les traductions sont fournies par des outils de traduction automatique. En cas de conflit entre le contenu d'une traduction et celui de la version originale en anglais, la version anglaise prévaudra.

Cadres et outils

Les frameworks frontaux, tels que Angular et Next.js, ne manquent pas, mais la plupart d'entre eux ne sont pas créés en pensant aux micro-frontends. Par conséquent, il leur manque parfois des mécanismes pour relever les défis de l'architecture micro-frontend.

Considérations générales relatives au cadre

Ce guide n'a pas pour but de recommander ou de comparer des cadres individuels. Comme plusieurs micro-frontends s'exécutent souvent sur la même page d'application Web, le chargement et les performances d'exécution sont des préoccupations majeures. Il est important de choisir un framework qui introduit le moins de frais possible.

Les frameworks sont divisés en fonction de la couche de rendu :

  • Rendu côté client (CSR)

  • Rendu côté serveur (SSR)

Les architectures frontales incluent d'autres fonctionnalités, telles que la génération de sites statiques (SSG). Cependant, le SSG n'est effectué qu'une seule fois. Les micro-frontends étant principalement composés au moment de l'exécution, CSR et SSR sont les principales options.

Rendu côté client

Pour la RSE, il existe deux options populaires :

  • Cadre SPA unique

  • Fédération de modules

Le Single SPA est un choix léger pour composer des micro-frontends. Il résout les problèmes les plus courants des architectures de micro-frontend, tels que la composition de plusieurs micro-frontends sur la même page et la prévention des conflits de dépendances.

Module Federation a commencé comme un plugin, proposé par Webpack 5, et il résout la grande majorité des défis des architectures de micro-frontend, y compris la gestion des dépendances entre différents artefacts. Module Federation 2.0 fonctionne nativement avec Rspack, webpack, esbuild, et maintenant avec. JavaScript

Envisagez de ne pas utiliser de framework du tout. Les navigateurs modernes, dont la part de marché globale est de 98 % selon caniuse.com, offrent des fonctionnalités telles que des éléments personnalisés de manière native, et ils conviennent parfaitement à une application de micro-frontends. Si nécessaire, combinez des éléments personnalisés avec des bibliothèques légères pour la propagation d'événements, l'internationalisation ou d'autres préoccupations spécifiques.

Rendu côté serveur

Du côté de la SSR, les deux principales options sont plus compliquées :

  • Adoptez un framework existant tel que Next.js et appliquez le principe des micro-frontends qui utilise la fédération de modules.

  • Utilisez HTML- over-the-wire pour échanger des fragments HTML qui représentent des micro-frontends, et composez ces fragments dans un modèle lors de l'exécution. Podium est un exemple de cette approche.