Grundläggande koncept och principer

Nu går vi igenom de grundprinciper som ligger bakom effektiva Micro Frontends – ritningen för skalbara, lättförvaltade och flexibla webbappar.

Fristående distribuerbarhet innebär att varje MFE levereras separat. En ändring i Product Details tvingar aldrig fram en ny distribution av Shopping Cart, så teamen kan släppa ändringar fritt.

Teknikagnostik låter varje team välja sin egen teknikstack – React för en MFE och Vue för en annan – så att de kan använda de bästa verktygen och undvika inlåsning i ett ramverk.

Isolering förhindrar konflikter: begränsa CSS så att stilar inte läcker, isolera JavaScript för att undvika globala konflikter och ge varje MFE ett eget DOM-område.

Vertikal uppdelning innebär att dela upp efter verksamhetsförmåga, inte efter lager – varje del äger sitt användargränssnitt ända ner till backend och data, så att teamen anpassas efter domänerna.

MFE:er fungerar bäst med autonoma team: varje litet team äger en MFE:s hela livscykel, vilket bygger expertis, snabbar upp beslutsfattandet och minskar kommunikationen mellan team.

Sammansättning är sättet som fristående MFE:er bildar ett användargränssnitt. Den kan ske på klientsidan i webbläsaren, på serversidan före sändning eller på edge-sidan i CDN:et.

Tidpunkten för sammansättningen spelar roll: vid byggtid paketeras MFE:er i en enda artefakt, vilket är mindre dynamiskt, medan vid körning laddas de i webbläsaren för större flexibilitet.

Delade beroenden som React eller ett designsystem bör laddas en gång, inte per MFE. Principen är att dela gemensamma bibliotek effektivt mellan alla MFE:er.

Sammanfattning av grundprinciperna: fristående distribuerbarhet, teknikagnostik, isolering, vertikal uppdelning, sammansättning och delade beroenden. Nästa steg: Module Federation.