Table des matières[Cacher][Montrer]
- Alors, qu'est-ce qu'une fédération de modules ?
- Pourquoi la fédération de modules ?
- Composants principaux de la fédération de modules
Fonctionnalités principales de la fédération de modules+-
- Excellentes performances Web
- Développement efficace
- La capacité d'auto-guérison et la redondance
- Gestion efficace des dépendances communes
- Au lieu de devoir redéployer les consommateurs, déployez du code indépendant.
- Lors de l'exécution, importez le code d'autres builds.
- Expérience développeur améliorée tout en préservant l'expérience client
- Les micro-interfaces fonctionnent de manière monolithique.
- Conclusion
Le concept de micro frontends applique les microservices au développement frontend.
L'idée est de diviser l'application ou le site Web en éléments plus petits, développés indépendamment, qui sont ensuite connectés pendant l'exécution, au lieu de les créer comme un monolithe unique et cohérent.
La méthode permet de créer d'autres composants de l'application en utilisant d'autres technologies et avec des équipes indépendantes.
L'idée est de réduire les dépenses de maintenance liées à un monolithe typique en segmentant ainsi le développement.
En leur permettant de se concentrer sur un domaine particulier d'une application en tant qu'équipe cohérente, cela rend également possible de nouvelles formes de coopération entre les développeurs backend et frontend.
Par exemple, vous pouvez avoir une équipe qui est uniquement responsable de la capacité de recherche ou d'un autre aspect d'un produit clé qui est crucial pour une entreprise.
Grâce à la fédération de modules, vous disposez de suffisamment de fonctionnalités pour gérer le workflow que le micro-interface mandats d'approche.
Cet article examinera en profondeur l'architecture de la fédération de modules, ainsi que ses principales fonctionnalités et modèles d'application.
Alors, qu'est-ce qu'un fédération de modules?
La conception de fédération de modules de Javascript utilise des parties réutilisées dans de nombreuses applications.
C'est un jargon assez basique, mais j'ai simplement fait en sorte que cela paraisse aéré.
Comme nous connaissons tous le partage de composants au sein d'une application React, la fédération de modules atteint effectivement le même objectif dans la pratique, à l'exception du fait qu'elle expose dynamiquement les modules d'application à la consommation par d'autres applications.
La fédération de modules cherche à surmonter le problème du partage de modules dans un système distribué en fournissant ces éléments partagés clés sous forme de macro ou de micro selon les besoins.
Ceci est accompli en les supprimant de vos applications et du flux de travail de construction.
Pourquoi la fédération de modules ?
Voici quelques facteurs que la fédération de modules peut facilement gérer :
- Les externes et les DLL (bibliothèques de liens dynamiques) étaient tout ce que nous avions occasionnellement pour partager des fonctionnalités entre les applications. Tout cela a rendu la mise à l'échelle du partage de code extrêmement difficile.
- Le NPM est lent.
- Lorsque deux programmes distincts partagent un code crucial, ils doivent être dynamiques et flexibles.
Pour que les applications autonomes soient totalement dans leur propre référentiel, se déploient séparément et fonctionnent comme leur propre SPA indépendant, Module Federation a été créé.
Composants principaux de la fédération de modules
Avant d'approfondir, il est important de discuter brièvement de quelques nouveaux concepts apportés par la fédération de modules.
- Hôte : lors du chargement d'une page, la construction ou le module initialement initialisé est appelé un hôte. Un fournisseur peut être considéré comme un hôte.
- Distant : un distant est une construction différente qui utilise une partie de l'hôte. Ils sont également appelés clients.
- Hôte bidirectionnel : une version Webpack qui fonctionne à la fois comme une télécommande consommée par d'autres hôtes et comme un hôte qui consomme des télécommandes.
- Fédération des fournisseurs : permet le partage d'exécution partagé de manière déclarative des dépendances du module npm pour un hôte ou un distant, quel que soit l'emplacement à partir duquel elles sont chargées. L'un des principaux problèmes de performances des micro-interfaces est résolu de cette manière.
Modèles d'application fédérée
Système de conception à feuilles persistantes
L'une des formes les plus élémentaires d'applications fédérées est une « télécommande permanente », qui est une télécommande partagée comme un « système de conception » ou une « bibliothèque de composants » qui est distribuée et mise à jour indépendamment pour tous les utilisateurs.
Sans que chaque équipe d'application ait besoin de passer du temps sur les révisions, cela peut être utile pour garantir que tous les sites en ligne adhèrent à l'identité d'entreprise la plus récente.
Afin de concevoir et de mettre en place les limites et les procédures nécessaires pour garantir des mises à jour sécurisées et continues, cela pourrait être un point de départ utile pour les entreprises lorsqu'elles envisagent une architecture d'application fédérée.
Voici quelques cas d'utilisation où des télécommandes partagées déployées indépendamment pourraient convenir :
- Systèmes de conception
- Coquilles d'application
- Bibliothèques de composants
- Les consommateurs
- Boîtes à outils partagées
- Modèles de distribution alternatifs pour les widgets utilisés par des utilisateurs internes ou externes
Partage de modules multi-SPA
Réutilisez les fonctionnalités déjà exportées, telles que les composants, dans différentes applications monopage autonomes. Les avantages incluent :
- Les consommateurs reçoivent des mises à jour automatisées
- L'expertise du domaine reste dans l'équipe qui en a la charge.
- Rationalise la procédure de déploiement car des versions de module distinctes ne sont pas nécessaires.
Fédération pilotée par Shell
La fédération basée sur le shell comprend :
- Lors de la création d'une nouvelle version de produit, l'équipe Produit n'attend pas que l'équipe Checkout termine son travail.
- Lors du changement de télécommande, il n'y a pas de rechargement de page.
- Si nécessaire, Shell propose un chargement à distance lent et un routage (de niveau supérieur).
- Le routage entre les télécommandes est rendu possible via la fédération des fournisseurs, ce qui permet la réutilisation des packages npm fréquemment utilisés.
- Shell offre le framework et d'autres dépendances communes qui sont réutilisées par les télécommandes chargées paresseusement.
Fédération multi-shell
Semblable à la fédération basée sur le shell décrite ci-dessus, mais utilise des shells différents.
Il contient:
- plusieurs coquillages
- Marque blanche
- Toutes les télécommandes ne sont pas requises par Shell B ou n'ont pas d'implémentations indépendantes.
Fonctionnalités principales de la fédération de modules
Excellentes performances Web
Le problème avec la composition normale du module NPM est qu'à mesure que le nombre de personnes à charge augmente, la taille de l'application augmente généralement.
Afin d'éviter de charger des bundles lors du chargement de votre application et de ne les charger que lorsque cela est nécessaire, Module Federation vous offre la possibilité de charger paresseusement des bundles.
Cela évite d'avoir à télécharger des modules avant qu'ils ne soient réellement requis, ce qui améliore la vitesse du site.
Développement efficace
Chaque projet peut être produit et livré de manière isolée et peut être réalisé par différentes équipes car Module Federation vous encourage à organiser votre application en projets discrets afin de pouvoir les construire et les déployer séparément (et donc en parallèle).
La capacité d'auto-guérison et la redondance
Les dépendances partagées permettent à Module Federation de garder une trace de toutes les dépendances de votre programme en un seul endroit.
De cette façon, même lorsqu'une application ne déclare pas de dépendance ou lorsqu'il y a des problèmes de réseau, elle sait toujours ce dont elle a besoin et peut gérer son téléchargement si nécessaire.
Gestion efficace des dépendances communes
De plus, Module Federation offre une gestion des dépendances supérieure, résolvant efficacement les exigences des fournisseurs et des tiers afin que votre application ne charge jamais plus d'une version d'une bibliothèque.
Au lieu de devoir redéployer les consommateurs, déployez du code indépendant.
Le développeur est très intéressé par la fonctionnalité evergreen. Une fois que les fonctionnalités dépendantes exposées ont changé, il ne sera plus nécessaire de réinstaller les consommateurs.
Je dois admettre qu'il s'agit d'une fonctionnalité très puissante en soi, qui nécessitera un examen attentif pour éviter des résultats inattendus.
Lors de l'exécution, importez le code d'autres builds.
Lors de l'adoption du modèle de package NPM, nous pourrions envisager des applications qui utilisent la fédération de modules comme des API plutôt que de partager du code et de penser à une « bibliothèque ».
De la même manière qu'elles peuvent également recevoir des fonctionnalités d'autres applications, les applications Web peuvent désormais fournir les fonctionnalités à d'autres applications.
Expérience développeur améliorée tout en préservant l'expérience client
Toutes Développeur JavaScript sera assez à l'aise avec Module Federation car il s'agit d'un plugin Webpack accessible à partir de la version 5 de Webpack.
C'est en fait assez fort et intrigant si on y réfléchit un peu.
En utilisant des chargeurs Webpack tiers, considérez tous les composants qui Webpack bundles, y compris les scripts, les ressources, les styles, les images, les démarques, etc.
En utilisant la fédération de modules, tous ces éléments peuvent être partagés et fédérés.
Les micro-interfaces fonctionnent de manière monolithique.
Il est assez facile d'ajouter des fonctionnalités partagées à votre application ; importez simplement le bundle normalement ou utilisez le chargement synchrone.
Alternativement, le chargement asynchrone peut être utilisé pour charger uniquement les dépendances lorsque cela est nécessaire en utilisant le chargement paresseux.
Conclusion
Dans cet article, nous avons présenté la fédération de modules comme un choix fantastique pour développer votre application micro-frontend.
Laisser les applications échanger et consommer des fonctionnalités au moment de l'exécution encourage l'évolutivité en permettant à différentes équipes de travailler sur des applications indépendantes.
Lorsque la fonctionnalité commune change, vous n'aurez pas besoin de concevoir et de déployer vos consommateurs car elle prend en charge la fonctionnalité permanente.
Votre programme fonctionnera comme un monolithe après sa mise en place, ce qui est fantastique.
Les dépendances partageables sont utilisées pour réduire la taille des applications. Étant donné que de nombreux développeurs connaissent déjà l'environnement Webpack, l'expérience de développement est excellente.
Soyez sympa! Laissez un commentaire