Table of Contents[Ferstopje][Toanje]
- Dat, wat is in modulefederaasje?
- Wêrom module federaasje?
- Module federaasje kearnkomponinten
Module Federation kearnfunksjes+-
- Excellent web prestaasje
- Effektive ûntwikkeling
- De mooglikheid om sels te genêzen en oerstalligens
- Effektive ôfhanneling fan mienskiplike ôfhinklikens
- Yn stee fan konsuminten opnij moatte ynsette, ynsette ûnôfhinklike koade.
- By it útfieren, ymportearje koade fan oare builds.
- Ferbettere ûntwikkeldersûnderfining by it behâld fan klantûnderfining
- Mikro-frontends operearje op in monolityske manier.
- Konklúzje
It konsept fan mikro-frontends jildt mikrotsjinsten foar frontendûntwikkeling.
It idee is om de applikaasje of webside op te brekken yn lytsere, ûnôfhinklik ûntwikkele stikken dy't dan ferbûn binne tidens runtime, yn tsjinstelling ta it meitsjen fan se as ien, gearhingjende monolith.
De metoade lit jo oare komponinten fan 'e applikaasje meitsje mei oare technologyen en mei ûnôfhinklike teams.
It idee is om de ûnderhâldskosten yn ferbân mei in typyske monolith te ferminderjen troch ûntwikkeling op dizze manier te segmentearjen.
Troch har te tastean har te konsintrearjen op in bepaald gebiet fan in applikaasje as in gearhingjend team, makket it ek nije foarmen fan gearwurking tusken backend en frontend devs mooglik.
Jo kinne bygelyks in team hawwe dat allinich ferantwurdlik is foar de sykmooglikheid as in oar aspekt fan in kaaiprodukt dat krúsjaal is foar in bedriuw.
Mei tank oan de module federaasje, do hast genôch funksjonaliteit te omgean de workflow dat de mikro frontend oanpak mandaten.
Dizze post sil in djippe blik nimme op 'e arsjitektuer fan' e modulefederaasje, lykas har haadfunksjes en tapassingspatroanen.
Dat, wat is in module federaasje?
Javascript's module federaasje-ûntwerp makket gebrûk fan opnij brûkte dielen yn in protte applikaasjes.
It is frij basaal jargon, mar ik haw it gewoan gewoan makke dat it sa loftich liket te wêzen.
Om't wy allegear bekend binne mei it dielen fan komponinten binnen in React-applikaasje, berikt Module Federation yn 'e praktyk itselde doel effektyf, mei de útsûndering dat it applikaasjemodules dynamysk bleatsteld foar konsumpsje troch oare applikaasjes.
Module Federation besiket te oerwinnen it probleem fan module dielen yn in ferspraat systeem troch it leverjen fan dy kaai dielde eleminten as makro of mikro as winske.
Dit wurdt dien troch se te ferwiderjen fan jo apps en de build-workflow.
Wêrom module federaasje?
Hjir binne wat faktoaren dy't modulefederaasje maklik kin omgean:
- Eksterne en DLL's (Dynamic Link Libraries) wiene alles wat wy soms hiene foar it dielen fan funksjonaliteit tusken apps. Dit alles makke skaalferdieling fan koade ekstreem útdaagjend.
- NPM is traach.
- As twa aparte programma's krúsjale koade diele, moatte se dynamysk en fleksibel wêze.
Om selsstannige apps folslein yn har eigen repository te wêzen, apart ynsette, en operearje as har eigen ûnôfhinklike SPA, waard Module Federation makke.
Module federaasje kearnkomponinten
Foardat jo djipper dûke, is it wichtich om in pear nije konsepten koart te besprekken dy't modulefederaasje bringt.
- Host: As in side laden wurdt, wurdt de bou of module dy't ynearsten inisjalisearre is in host neamd. In provider kin beskôge wurde as in host.
- Remote: In ôfstân is in oare konstruksje dy't in diel fan 'e host brûkt. Se wurde ek oantsjut as klanten.
- Bi-directional host: in Webpack-build dy't funksjonearret as sawol in ôfstân dy't oare hosts konsumearje as in host dy't remotes konsumearret.
- Vendor federaasje: stelt declaratively dield runtime dielen fan npm module ôfhinklikens foar in host of ôfstân, nettsjinsteande de lokaasje wêrfan se wurde laden. Ien fan 'e grutte prestaasjesproblemen mei mikrofronten wurdt op dizze manier oplost.
Patterns fan Federated Application
Evergreen Design System
Ien fan 'e meast basale foarmen fan federearre applikaasjes is in "evergreen remote", dat is in dielde ôfstân lykas in "Design System" of "Component Library" dy't ûnôfhinklik wurdt ferspraat en bywurke foar alle brûkers.
Sûnder dat elk app-team tiid hoecht te besteegjen oan ferzjes, kin dit nuttich wêze om te garandearjen dat alle online siden har hâlde oan de meast resinte bedriuwsidentiteit.
Om de grinzen en prosedueres te ûntwerpen en yn te setten dy't nedich binne om feilige, trochgeande updates te garandearjen, kin dit in nuttich plak wêze foar bedriuwen om te begjinnen by it beskôgjen fan in federearre applikaasje-arsjitektuer.
Folgje binne guon gebrûksgefallen wêr't ûnôfhinklik ynset dielde ôfstânsôfstâns in geskikte fit kinne wêze:
- Design systemen
- Applikaasje shells
- Component biblioteken
- Consumers
- Dielde toolkits
- Alternative distribúsjemodellen foar widgets brûkt troch ynterne as eksterne
Multi-SPA Module Sharing
Brûk al eksportearre funksjes, lykas komponinten, opnij yn ferskate standalone apps mei ien side. Foardielen omfetsje:
- Konsuminten krije automatyske updates
- Domeinekspertize bliuwt by it team dat der de lieding oer hat.
- Streamlines de ynsetproseduere om't aparte module releases net nedich binne.
Shell oandreaune federaasje
De shell-oandreaune federaasje omfettet:
- By it meitsjen fan in nije produktferzje wachtet it produktteam net op it Checkout-team om har taak te foltôgjen.
- By it wikseljen fan remotes is d'r gjin side opnij laden.
- As it nedich is, biedt Shell trage laden op ôfstân en (top-nivo) routing.
- Routing oer remotes wurdt mooglik makke fia ferkeaperfederaasje, wat it wergebrûk mooglik makket fan faak brûkte npm-pakketten.
- Shell biedt it ramt en oare mienskiplike ôfhinklikens dy't wurde opnij brûkt troch de lazy laden remotes.
Multi-shell federaasje
Fergelykber mei de shell-oandreaune federaasje hjirboppe beskreaun, mar brûkte ferskate skelpen.
It befettet:
- in oantal skelpen
- Wite-labeling
- Net alle remotes binne fereaske troch Shell B of hawwe ûnôfhinklike ymplemintaasjes.
Module Federation kearnfunksjes
Excellent web prestaasje
It probleem mei de normale komposysje fan NPM-module is dat as it oantal ôfhinkliken tanimt, de grutte fan 'e applikaasje oer it algemien groeit.
Om it laden fan bondels te foarkommen as jo applikaasje laden en se allinich lade as it nedich is, biedt Module Federation jo de mooglikheid om bondels lui te laden.
Dit foarkomt de needsaak om modules te downloaden foardat se wirklik ferplicht binne, wat de sidesnelheid ferbettert.
Effektive ûntwikkeling
Elk projekt kin wurde produsearre en levere yn isolemint en kin wurde útfierd troch ferskate teams omdat Module Federation stimulearret jo te organisearjen jo applikaasje yn diskrete projekten, sadat jo kinne bouwe en ynsette se apart (en dus yn parallel).
De mooglikheid om sels te genêzen en oerstalligens
Dielde ôfhinklikens kinne Module Federation alle ôfhinklikens fan jo programma op ien plak byhâlde.
Op dizze manier, sels as in applikaasje gjin ôfhinklikens ferklearret of as d'r netwurkproblemen binne, wit it noch wat it nedich is en kin it sa nedich downloade.
Effektive ôfhanneling fan mienskiplike ôfhinklikens
Dêrnjonken biedt Module Federation superieur ôfhinklikensbehear, it effektyf oplossen fan easken fan leveransiers en tredden, sadat jo applikaasje noait mear as ien ferzje fan in bibleteek sil laden.
Yn stee fan konsuminten opnij moatte ynsette, ynsette ûnôfhinklike koade.
De ûntwikkelder is tige ynteressearre yn it hawwen fan evergreen funksjonaliteit. Sadree't bleatstelde ôfhinklike funksjonaliteit is feroare, sil it net mear nedich wêze om de konsuminten opnij te ynstallearjen.
Ik moat tajaan dat dit in heul krêftige funksje op himsels is, ien dy't foarsichtich ûndersyk nedich is om ûnferwachte útkomsten te foarkommen.
By it útfieren, ymportearje koade fan oare builds.
By it oannimmen fan it NPM-pakketmodel, kinne wy apps beskôgje dy't Module Federation brûke ferlykber mei API's ynstee fan koade te dielen en te tinken oan "bibleteek."
Op deselde manier as se ek funksjonaliteit kinne ûntfange fan oare apps, kinne webapplikaasjes no de funksjonaliteit leverje oan oare applikaasjes.
Ferbettere ûntwikkeldersûnderfining by it behâld fan klantûnderfining
Any JavaSkript ûntwikkelder sil frij noflik wêze mei Module Federation, om't it in Webpack-plugin is dy't tagonklik is fan Webpack ferzje 5.
Dit is eins nochal sterk en yntrigearjend as wy der wat neitinke.
Troch te brûken Webpack-laders fan tredden, beskôgje alle komponinten dy't Webpack bondels, ynklusyf skripts, aktiva, stilen, ôfbyldings, markdowns, en mear.
Troch it brûken fan Module Federation, kinne al dizze wurde dield en federearre.
Mikro-frontends operearje op in monolityske manier.
It is frij maklik om dielde funksjonaliteit ta te foegjen oan jo applikaasje; ymportearje gewoan de bondel as normaal of brûk syngroane laden.
As alternatyf kin asynchrone laden brûkt wurde om allinich ôfhinklikens te laden as it nedich is troch luie laden te brûken.
Konklúzje
Yn dizze post hawwe wy Module Federation besprutsen as in fantastyske kar foar it ûntwikkeljen fan jo mikro-frontend-applikaasje.
It litten fan apps funksjonaliteit útwikselje en konsumearje by runtime stimulearret skaalberens troch ferskate teams yn te skeakeljen om te wurkjen oan ûnôfhinklike applikaasjes.
As de mienskiplike funksjonaliteit feroaret, hoege jo jo konsuminten net te ûntwerpen en yn te setten, om't it ivige griene funksjonaliteit stipet.
Jo programma sil funksjonearje as in monolith neidat it is ynsteld, dat is fantastysk.
Dielbere ôfhinklikens wurde brûkt om de grutte fan apps te ferminderjen. Om't in protte ûntwikkelders al bekend binne mei de Webpack-omjouwing, is de ûntwikkeldersûnderfining poerbêst.
Leave a Reply