Qu’est ce que les microfrontends et quand les utiliser ?

Les microfrontends sont une approche de conception dans laquelle un monolithe de frontend est divisé en morceaux plus petits et plus faciles à gérer. Il s’agit de l’équivalent pour le frontend des microservices pour le backend. Plutôt qu’une grande base de code interconnectée, vous avez plusieurs bases de code plus petites. Chacune d’entre elles est responsable d’un ensemble spécifique de fonctionnalités ou d’une partie de l’interface utilisateur, et elles peuvent être développées, déployées et mises à l’échelle de manière indépendante.

Concepts clés des microfrontend

Pour mettre en œuvre efficacement les micro-frontaux, il est essentiel d’approfondir leurs deux principes fondamentaux :

Développement indépendant

Les équipes de développement peuvent fonctionner comme des unités autonomes au sein d’un projet plus vaste grâce aux microfrontend. Chaque module de microfrontend se comporte comme une entité autonome, responsable d’une caractéristique ou d’une fonction spécifique.

Quels sont les avantages du développement indépendant ?

• Itérations plus rapides : Les équipes peuvent itérer et publier des mises à jour de manière indépendante, ce qui accélère le processus de développement.
• Réduction des goulots d’étranglement : La réduction des dépendances entre les équipes permet de rationaliser l’ensemble du processus de développement.

Autonomie des modules

Chaque module est conçu pour être autonome et indépendant. Ces modules n’ont pas besoin de s’appuyer sur d’autres parties de l’application pour fonctionner correctement. Ce niveau d’autonomie s’étend à la fois au développement et à l’exécution des micro-frontaux.

Quels sont les avantages de l’autonomie des modules ?

• Isolation des défaillances : Si un module rencontre des problèmes ou nécessite des mises à jour, il peut être corrigé sans affecter la stabilité de l’ensemble de l’application.
• Évolutivité accrue : La nature modulaire des micro-frontaux permet d’adapter plus facilement des composants spécifiques pour répondre à une demande accrue.
• Flexibilité des piles technologiques : Les équipes peuvent sélectionner la pile technologique la plus appropriée pour leur microfrontend sans être contraintes par les choix faits ailleurs dans l’application.

Monorepository :

Il s’agit d’applications dans lesquelles tous les projets se trouvent en fin de compte dans le même dépôt.

Bien que cela puisse sembler quelque peu contradictoire avec la théorie des microfrontends, où l’on cherche à générer des projets qui sont indépendants, pour les intégrer plus tard, dans ce cas on a pour tous les projets un seul système de dépendances et de sous-dossiers pour chacun de ces projets.

Un exemple de ce type de microfrontend est celui donné par défaut par Angular pour générer en interne des sous-applications.

Multirepository :

Vous avez les projets dans différents dépôts. Cela implique que les projets soient plus isolés, avec un système de dépendances indépendant pour chacun d’entre eux.

Metarepository :

Il s’agit de la stratégie qui cherche à adopter les deux types précédents. Ainsi, dans ce type, il y aura plusieurs référentiels, mais en plus il y en aura un où ils seront tous intégrés.

Évolutivité

L’architecture microfrontend permet de décomposer les applications en unités plus petites et indépendantes. Cela favorise une plus grande évolutivité, car les équipes peuvent se concentrer sur le développement de composants spécifiques sans avoir à comprendre l’ensemble de la base de code.

Développement autonome

Avec les microfrontend, différentes équipes peuvent travailler indépendamment sur des composants distincts en utilisant la stack technologique la mieux adaptée aux exigences de leur composant. Cette autonomie facilite le développement en parallèle, ce qui permet de réduire les délais des projets et d’augmenter la productivité globale.

Facilité de déploiement

Compte tenu de sa nature indépendante, cela permet des déploiements plus fréquents et plus isolés. Cela minimise le risque de déployer des changements sur une application étendue et monolithique et facilite un déploiement plus rapide des fonctionnalités.

Amélioration des tests

L’isolation des composants améliore également le processus de test. Chaque microfrontend peut être validé individuellement, ce qui permet de réduire les bogues, d’améliorer la qualité du code et de rendre l’application plus fiable.

Modernisation

En permettant à chaque composant d’être mis à jour ou remplacé indépendamment, l’architecture des micro-fronts permet à une organisation de moderniser ses applications de manière incrémentale. Cela réduit les risques associés aux révisions importantes et permet aux organisations d’adopter de nouvelles technologies à leur propre rythme.

Complexité accrue

L’architecture microfrontend peut introduire une complexité supplémentaire en raison de la nécessité d’une communication entre les composants, de stacks technologiques disparates et de l’orchestration de pipelines de déploiement multiples. Cela peut entraîner une augmentation des frais généraux liés à la coordination de l’équipe et à la planification de l’architecture.

Défis de cohérence

Le maintien d’une expérience utilisateur et d’une interface cohérentes entre plusieurs composants développés de manière indépendante peut s’avérer difficile. Cela nécessite un respect strict des directives de conception et une communication régulière entre les équipes pour garantir une expérience unifiée et cohérente à l’utilisateur final.

Impact potentiel sur les performances

Selon la manière dont l’architecture des microfrontend est mise en œuvre, elle peut entraîner des problèmes de performance. Ceux-ci peuvent résulter du chargement de plusieurs frameworks ou bibliothèques pour différents composants, ce qui augmente la taille globale de l’application et le temps de chargement.

Frais généraux d’exploitation

Il peut nécessiter une infrastructure et des efforts de gestion supplémentaires pour le déploiement indépendant, la mise à l’échelle et la surveillance des différents composants. Cela peut entraîner une augmentation des coûts opérationnels et des ressources.

Gestion des composants partagés

Le partage de fonctionnalités ou de composants standard entre différents éléments peut s’avérer complexe et impliquer la mise en place et la maintenance d’une bibliothèque de composants partagés, ce qui constitue un autre surcoût opérationnel.

Les microfrontend sont particulièrement bien adaptés à des scénarios et à des types d’applications spécifiques, ce qui en fait un choix architectural stratégique lorsque les conditions ou les besoins suivants se présentent :

Grandes applications avec de nombreuses fonctions

Complexité : dans les applications à grande échelle, le frontend peut devenir de plus en plus complexe car il intègre de nombreuses caractéristiques et fonctions. Les microfrontends aident à gérer cette complexité en divisant l’application en modules plus petits et plus faciles à gérer.

Problèmes d’évolutivité : Au fur et à mesure qu’une application se développe, elle est souvent confrontée à des problèmes d’évolutivité. Les microfrontends offrent une solution en vous permettant de faire évoluer des modules spécifiques de manière indépendante, ce qui garantit que votre application reste réactive et fonctionne de manière optimale.

Ensembles de fonctions isolées

Segmentation : Les microfrontends excellent lorsqu’il est clairement nécessaire de segmenter l’application en ensembles de fonctions isolés. À l’instar d’un smartphone qui comporte des applications distinctes pour différentes tâches, les microfrontends vous permettent de créer des modules distincts pour différentes fonctions au sein de votre application web.

Équipes spécialisées : Si vos équipes de développement ont des compétences spécialisées ou des domaines d’intérêt, les microfrontends permettent à chaque équipe de s’approprier un module spécifique.

Évolution des besoins de l’entreprise

Adaptabilité : Les microfrontends offrent une certaine souplesse face à l’évolution des besoins de l’entreprise. Lorsque de nouvelles caractéristiques ou fonctions sont nécessaires, les équipes peuvent les développer et les déployer indépendamment sans perturber l’application existante.

Développement itératif : Les microfrontends prennent en charge une approche de développement itérative. Vous pouvez continuellement améliorer et développer votre application sans avoir à revoir l’ensemble de la base de code, ce qui garantit que votre application reste adaptable et compétitive.

Diverses stack techniques

Flexibilité technologique : Les microfrontends offrent une certaine souplesse dans le choix des stack techniques. Différents modules peuvent être développés en utilisant les technologies qui répondent le mieux à leurs besoins spécifiques. Cette adaptabilité vous permet de tirer parti des atouts de divers frameworks et bibliothèques au sein d’une même application.

Recrutement et compétences : La liberté d’utiliser diverses stacks technologiques peut également simplifier les processus de recrutement. Les équipes peuvent être constituées autour d’une expertise technologique spécifique, et les nouveaux développeurs peuvent facilement intégrer des équipes correspondant à leurs compétences.

Collaboration entre les équipes

Indépendance de l’équipe : Les microfrontends favorisent la collaboration entre les équipes tout en préservant leur indépendance. Les équipes peuvent travailler simultanément sur différents modules sans se marcher sur les pieds, ce qui réduit les goulots d’étranglement et améliore l’efficacité globale.

Réduction des conflits : Avec des limites claires entre les modules, les risques de conflits et d’affrontements entre les bases de code sont réduits au minimum, ce qui permet une collaboration plus harmonieuse entre les équipes.