Sandwich

Copenhagen

Odense

Dänemark.

Berlin

Hamburg

Düsseldorf

Deutschland.

Paris

Strasbourg

Frankreich.

Dnipro

Mykolaiv

Ukraine.

Chisinau

Moldawien.

Sofia

Veliko Tarnovo

Gabrovo

Plovdiv

Bulgarien.

Hanoi

Vietnam.

Boise

New Jersey

USA.

Bukarest

Rumänien.

Vienna

Österreich.

Home

Über uns

Best Cases

Services

Insights

Kontakt

English

Dansk

Français

Deutsch

English UK

Die Idee hinter MFEs ist es, eine Website oder Webanwendung als eine Komposition von Funktionen zu betrachten, die im Besitz von unabhängigen Teams sind. Es ist ein architektonischer Stil, bei dem unabhängig lieferbare Frontend-Anwendungen zu einem größeren Ganzen zusammengesetzt werden. Erfahren Sie, wie MFEs im Einzelnen funktionieren und welche Vorteile ihre Verwendung mit sich bringt: Skalierbarkeit für Teams, Wiederverwendbarkeit und Technologieunabhängigkeit.
Mikro-Frontends - kurz MFEs genannt - sind weder ein neuer Ansatz, noch der einzig gute den Entwickler:innen und Teams verwenden sollten, um wartbare und skalierbare Frontend-Anwendungen zu erstellen. Es ist jedoch eine Arbeitsweise, die einer Organisation Vorteile bringen kann, wenn sie richtig eingesetzt wird und sich an den Bedürfnissen der Projekte orientiert.
Ein MFE ist ein Code für das Segment einer Anwendung. Darüber hinaus gibt es ein Mikro-Frontend-Framework, das für die Verwaltung des Ladens und Entladens der Mikro-Frontends sowie für alle Operationen wie I/O (Input/Output), Routing zwischen Mikro-Frontends, globale Konfigurationen usw. zuständig ist.
Lassen Sie uns ein wenig in einen der heutzutage am weitesten verbreiteten Ansätze eintauchen - Single-Page-Anwendungen, auch bekannt als SPAs. SPAs bedeuten, dass der gesamte source Code geladen wird und dann APIs und Datenbanken verwendet werden, um eine Verbindung herzustellen. Schließlich wird der Inhalt  auf der Kundenseite gerendert.
Ein Beispiel für ein solches Anwendungs-Framework würde etwa so aussehen:

Wenn Sie sich den Back-End- und DevOps-Teil ansehen, erkennen Sie, dass sie in der Regel eine Struktur haben, die ihnen eine unabhängige Skalierung mit enger Leistungsbegrenzung ermöglicht, die dann bei der Bereitstellung Ihrer Dienste absolut autonom wird.

Wenn ein Unternehmen wächst und seine Teams auch expandieren, müssen sie die Bereiche der Organisation ermitteln, denen besondere Aufmerksamkeit zukommen soll. In der Regel nimmt ein Team eine monolithische Struktur, teilt sie in mehrere Micro-Services auf und schafft eine dedizierte Infrastruktur.
Aber was machen Sie auf der Front-End-Seite? Die Skalierung und Wartung werden sehr schwierig, wenn mehrere verteilte Teams an derselben Code-Basis arbeiten. Dadurch entstehen Kommunikationsprobleme für die Verwaltung verschiedener Teile der Benutzeroberfläche, Wechselwirkungen zwischen Teams usw.
<h4>Skalierung unserer Anwendungen mit Micro-Front-Ends</h4>

Wie bereits erläutert, nehmen wir unsere monolithische Struktur und unterteilen sie in mehrere APIs, die von Containern angetrieben werden, wodurch unsere Infrastruktur geschaffen wird, die für bestimmte Micro-Services bestimmt ist. Die gleiche Vorgangsweise kann für das Micro-Front-End angewendet werden.
Die Einführung von MFEs bringt Autonomie innerhalb eines Geschäftsbereichs, Verantwortung der Teams für jede Domain (oder Sub-domain), an der sie arbeiten, und nicht zuletzt die Fähigkeit, Verbesserungen und neue Funktionen für bestimmte MFEs einzuführen, ohne die gesamte Struktur und Anwendung zu beeinträchtigen.
<h4>Hauptvorteile von Micro-Front-Ends</h4>
Team-Skalierbarkeit, was bedeutet, dass jedes Team autonom eingerichtet werden und erfinden, organisieren, initiieren und liefern kann, ohne andere Teile der Anwendung zu beeinträchtigen. Auf diese Weise kann ein Team, das für einen Teil der Anwendung verantwortlich ist, eine Bereitstellung unabhängig von einem anderen Team vornehmen.
Dabei sollten Sie „horizontale“ Teams, die für den gleichen Bereich in zwei oder mehreren MFEs verantwortlich sind, vermeiden. Ein vertikaler Ansatz ist stattdessen geeigneter und nachhaltiger. Ein vertikaler Ansatz bedeutet, dass ein Team, das an einem Micro-Front-End arbeitet, absolut funktionsübergreifend ist und über das gesamte Wissen verfügt, um selbstständig zu arbeiten.
Der MFE-Ansatz ermöglicht es beispielsweise auch dem Plattform-Team, das für die übergeordnete Struktur der Micro-Front-Ends verantwortlich ist, sich stärker auf langfristige Ziele, Leistungen, Routing usw. zu konzentrieren.

Die Micro-Front-End-Teams sind kundenorientierter. Sie interessieren sich mehr für die Konvertierung und Bindung des Kunden und die Verbesserung der Sub-Domain, an der sie arbeiten.
Der zweite Vorteil dieses Ansatzes ist die Wiederverwendbarkeit. Sie können jeden Teil wie etwa die Navigationskomponente übernehmen und wiederverwenden, wann immer Sie wollen, solange Sie den MFE-Standard befolgen. Gleiches gilt auch für andere Teile. Eine gute Möglichkeit für wiederverwendbare Komponenten in den verschiedenen Micro-Front-Ends ist die Erstellung einer gemeinsamen Komponentenbibliothek, die Sie separat verwalten und bei Bedarf verwenden können. Es ist für die Teams sehr hilfreich, wenn dies frühzeitig geplant wird und alle Vor- und Nachteile berücksichtigt werden, bevor man sich für den besten Ansatz entscheidet.
Der dritte Vorteil des MFE-Ansatzes ist die Technologieagnostik. So kann etwa die Struktur in Vanilla JS geschrieben sein und jedes unserer Micro-Front-Ends in React, Vue.js oder was auch immer geeignet ist, solange wir den Standard der MFEs beibehalten.
Um die Vorteile zusammenzufassen: Mit MFE können Sie eine bessere Teamskalierbarkeit, die Wiederverwendbarkeit des Codes, selbstständige Teams und unabhängige Bereitstellungen sowie Technologieagnostik erreichen.
Es muss beachtet werden, dass MFEs Komplexität mit sich bringen und Komplexität nicht immer ein wünschenswertes Merkmal ist.
Wünschen Sie weitere Informationen? <a href="https://ffwagency.com/contact-us">Setzen Sie sich mit uns in Verbindung</a> und erfahren Sie, wie Sie MFEs nutzen können.
***
Radoslav Radoychev ist Leiter der Front-End-Entwicklung in unseren Büros in Gabrovo und Veliko Tarnovo, Bulgarien.

MFEs – eine Lösung für skalierbare Web-Anwendungen

Thought

Drupal 9: Eine Übersicht zum Upgrade.

4 Schritte für einen erfolgreichen Content-Audit

ZDFheute: Relaunch aus dem Home-Office

Does it spark joy? Ein Plädoyer für die Präsenzarbeit

Hey Google: Ist das ein Experiment?

Web? Native? Web-Native!

Mehr Mut bei den Ausschreibungen!

Digitaler Pustekuchen

UX als maßgebender Faktor im Branding

"Mehr Tempo in der Mobilitätswende"

Das wohl dümmste Marketing aller Zeiten

Apples Spagat zwischen Datenschutz und Werbeindustrie

Die (Super-)App-Revolution

Mobilität neu denken, Lebensqualität steigern

#Shapeyourperformance – Rhenoflex mit neuer Website

FFW überreicht Women in Drupal Awards 2022

Top 3 Kundenclubs für mehr Loyalität

Was bedeutet Personalisierung?

Digital und smart – Mobilität neu denken

Women in Drupal Award geht in zweite Runde 

Acquia Engage Awards 2023

Treffen Sie uns auf der DrupalCon Lille 2023

FFW lobt Women in Drupal Award 2023 aus

FFW und Kunden feiern drei Acquia Engage Auszeichnungen

Digitale Investitionen: Neues Framework für belastbare Entscheidungen

JAKALA feiert 24 Jahre Exzellenz

MVPs – Über Herausforderungen und Potenziale

MFEs – eine Lösung für skalierbare Web-Anwendungen

21. Juli 2022