Tartalomjegyzék[Elrejt][Előadás]
- Tehát mi az a modulszövetség?
- Miért a modulok összevonása?
- Modul-összevonás alapvető összetevői
Modul Federation alapvető jellemzői+-
- Kiváló webes teljesítmény
- Hatékony fejlesztés
- Az öngyógyítás képessége és a redundancia
- A közös függőségek hatékony kezelése
- A fogyasztók újratelepítése helyett független kódot telepítsen.
- Futás közben importáljon kódot más buildekből.
- Továbbfejlesztett fejlesztői élmény az ügyfélélmény megőrzése mellett
- A mikro-frontendek monolit módon működnek.
- Következtetés
A mikro frontendek koncepciója a mikroszolgáltatásokat alkalmazza a frontend fejlesztéshez.
Az ötlet az, hogy az alkalmazást vagy a webhelyet kisebb, egymástól függetlenül fejlesztett darabokra bontják, amelyeket aztán futás közben összekapcsolnak, ahelyett, hogy egyetlen, összefüggő monolitként hoznák létre őket.
A módszer lehetővé teszi az alkalmazás egyéb összetevőinek létrehozását más technológiák használatával és független csapatokkal.
Az ötlet az, hogy a fejlesztés ilyen módon történő szegmentálásával csökkentsék a tipikus monolithoz kapcsolódó karbantartási költségeket.
Lehetővé teszi számukra, hogy koherens csapatként egy alkalmazás egy adott területére összpontosítsanak, új együttműködési formákat tesz lehetővé a háttér- és előtér-fejlesztők között.
Például előfordulhat, hogy van egy csapata, amely kizárólag a keresési képességekért vagy egy kulcsfontosságú termék más szempontjáért felelős, amely kulcsfontosságú egy vállalkozás számára.
A modul-összevonásnak köszönhetően elegendő funkcionalitással rendelkezik a munkafolyamat kezelésére mikro frontend megközelítési mandátumok.
Ez a bejegyzés alaposan áttekinti a modulszövetség architektúráját, valamint főbb jellemzőit és alkalmazási mintáit.
Szóval, mi az a modulszövetség?
A Javascript modul-összevonási kialakítása számos alkalmazásban felhasználja az újrafelhasznált alkatrészeket.
Meglehetősen alapvető zsargon, de egyszerűen csak úgy tűnt fel, hogy szellősnek tűnjön.
Mivel mindannyian ismerjük a komponensek megosztását a React alkalmazáson belül, a Module Federation gyakorlatilag ugyanazt a célt éri el, azzal az eltéréssel, hogy dinamikusan teszi elérhetővé az alkalmazásmodulokat más alkalmazások számára.
A Modul Federation az elosztott rendszerben a modulmegosztás problémáját próbálja leküzdeni azáltal, hogy a kulcsfontosságú megosztott elemeket kívánság szerint makróként vagy mikroként szállítja.
Ezt úgy érheti el, hogy eltávolítja őket az alkalmazásokból és az összeállítási munkafolyamatból.
Miért a modulok összevonása?
Íme néhány olyan tényező, amelyeket a modul-összevonás könnyen kezelhet:
- Alkalmanként csak külső és DLL-ek (Dynamic Link Libraries) voltak a funkciók megosztásához az alkalmazások között. Mindez rendkívül nagy kihívást jelentett a méretezési kódmegosztásban.
- Az NPM lassú.
- Ha két különálló program kulcsfontosságú kódon osztozik, dinamikusnak és rugalmasnak kell lenniük.
Annak érdekében, hogy az önálló alkalmazások teljesen a saját tárukban legyenek, külön telepíthetők, és saját független SPA-ként működjenek, létrehoztuk a Modul-összevonást.
Modul-összevonás alapvető összetevői
Mielőtt mélyebbre merülne, fontos röviden megvitatni néhány új koncepciót, amelyeket a modulok összevonása hoz.
- Gazda: Amikor egy oldal betöltődik, az eredetileg inicializált buildet vagy modult gazdagépnek nevezik. A szolgáltató felfogható gazdaként.
- Távoli: A távoli egy másik konstrukció, amely a gazdagép egy részét használja. Ügyfeleknek is nevezik őket.
- Kétirányú gazdagép: egy Webpack build, amely más gazdagépek által használt távvezérlőként és távvezérlőket használó gazdagépként is működik.
- Szállító-összevonás: lehetővé teszi az npm-modul függőségeinek deklaratívan megosztott futásidejű megosztását egy gazdagép vagy távoli számára, függetlenül a betöltés helyétől. A mikro frontendek egyik fő teljesítményproblémája megoldódik ily módon.
Az egyesített alkalmazás mintái
Örökzöld Tervezőrendszer
Az egyesített alkalmazások egyik legalapvetőbb formája az „örökzöld távirányító”, amely egy megosztott távirányító, mint például a „Design System” vagy „Component library”, amelyet függetlenül terjesztenek és frissítenek minden felhasználó számára.
Anélkül, hogy minden alkalmazáscsapatnak időt kellene fordítania a felülvizsgálatokra, ez hasznos lehet annak biztosításában, hogy minden online webhely megfeleljen a legújabb vállalati identitásnak.
A biztonságos, folyamatos frissítések garantálásához szükséges korlátok és eljárások megtervezése és bevezetése érdekében ez hasznos hely lehet a vállalkozások számára, amikor az egyesített alkalmazásarchitektúrát fontolgatják.
Az alábbiakban felsorolunk néhány olyan használati esetet, amikor a függetlenül telepített megosztott távirányítók megfelelőek lehetnek:
- Tervező rendszerek
- Alkalmazáshéjak
- Komponenskönyvtárak
- Fogyasztók
- Megosztott eszköztárak
- Alternatív terjesztési modellek a belső vagy külső által használt widgetek számára
Több SPA modul megosztása
Használja újra a már exportált funkciókat, például összetevőket, különböző önálló egyoldalas alkalmazásokban. Az előnyök közé tartozik:
- A fogyasztók automatikus frissítéseket kapnak
- A domain szakértelem továbbra is a felelős csapatnál marad.
- Egyszerűsíti a telepítési eljárást, mert nincs szükség külön modul kiadásokra.
Shell által vezérelt szövetség
A héjvezérelt szövetség a következőket tartalmazza:
- Új termékverzió létrehozásakor a termékcsapat nem várja meg, hogy a Checkout csapata befejezze a munkáját.
- Távirányító váltáskor nincs oldal újratöltés.
- Ha szükséges, a Shell lassú távoli betöltést és (legfelső szintű) útválasztást kínál.
- A távirányítók közötti útválasztást a szállítói összevonás teszi lehetővé, amely lehetővé teszi a gyakran használt npm-csomagok újrafelhasználását.
- A Shell kínálja a keretrendszert és más gyakori függőségeket, amelyeket a lusta betöltött távirányítók újra felhasználnak.
Többhéjú szövetség
Hasonló a fent leírt shell-vezérelt szövetséghez, de más shelleket használt.
Tartalmaz:
- számos kagyló
- Fehér címkézés
- Nem minden távirányítóra van szüksége a Shell B-nek, és nem rendelkezik független megvalósítással.
Modul Federation alapvető jellemzői
Kiváló webes teljesítmény
A normál NPM-modul összetételével az a probléma, hogy az eltartottak számának növekedésével az alkalmazás mérete általában nő.
Annak érdekében, hogy elkerülje a kötegek betöltését az alkalmazás betöltésekor, és csak akkor töltse be őket, ha szükséges, a Modul-összevonás lehetőséget kínál a kötegek lusta betöltésére.
Ez megakadályozza, hogy a modulokat még azelőtt le kelljen tölteni, hogy ténylegesen szükség lenne rájuk, ami javítja a webhely sebességét.
Hatékony fejlesztés
Minden projekt különállóan állítható elő és szállítható, és különböző csapatok hajthatják végre, mert a Modul Federation arra ösztönzi, hogy az alkalmazásokat különálló projektekbe szervezze, hogy külön-külön (és így párhuzamosan) is megépíthesse és telepíthesse azokat.
Az öngyógyítás képessége és a redundancia
A megosztott függőségek lehetővé teszik a Modul-összevonás számára, hogy egy helyen nyomon kövesse a program összes függőségét.
Így még akkor is, ha egy alkalmazás nem deklarál függőséget, vagy ha hálózati problémák vannak, akkor is tudja, mire van szüksége, és szükség szerint tudja letölteni.
A közös függőségek hatékony kezelése
Ezenkívül a Module Federation kiváló függőségkezelést kínál, hatékonyan oldja meg a szállítói és harmadik felek követelményeit, így az alkalmazás soha nem tölti be a könyvtár egynél több verzióját.
A fogyasztók újratelepítése helyett független kódot telepítsen.
A fejlesztőt nagyon érdekli az örökzöld funkcionalitás. Ha a függő funkcionalitás megváltozott, többé nem kell újratelepíteni a fogyasztókat.
Be kell vallanom, hogy ez már önmagában is rendkívül erős tulajdonság, amely alapos vizsgálatot igényel a váratlan következmények elkerülése érdekében.
Futás közben importáljon kódot más buildekből.
Az NPM-csomagmodell alkalmazásakor fontolóra vehetjük azokat az alkalmazásokat, amelyek az API-khoz hasonló modul-összevonást használnak a kód megosztása és a „könyvtár” gondolkodása helyett.
Ugyanúgy, ahogyan más alkalmazásoktól is kaphatnak funkciókat, a webalkalmazások mostantól más alkalmazások számára is biztosíthatják a funkcionalitást.
Továbbfejlesztett fejlesztői élmény az ügyfélélmény megőrzése mellett
Bármilyen JavaScript fejlesztő elég kényelmes lesz a Module Federation használatával, mert ez egy Webpack beépülő modul, amely a Webpack 5-ös verziójától elérhető.
Ez valójában meglehetősen erős és izgalmas, ha kicsit elgondolkodunk rajta.
Harmadik féltől származó Webpack betöltők használatával vegye figyelembe az összes olyan összetevőt, amely webpack csomagok, beleértve a szkripteket, eszközöket, stílusokat, képeket, leárazásokat és egyebeket.
A Modul-összevonás használatával ezek mindegyike megosztható és egyesíthető.
A mikro-frontendek monolit módon működnek.
Nagyon egyszerű megosztott funkciókat hozzáadni az alkalmazáshoz; egyszerűen importálja a csomagot, vagy használjon szinkron betöltést.
Alternatív megoldásként az aszinkron betöltés használható a függőségek betöltésére, ha szükséges, lusta betöltés használatával.
Következtetés
Ebben a bejegyzésben a Modul-összevonást tárgyaltuk, mint egy fantasztikus választást a mikro-frontend alkalmazás fejlesztéséhez.
Ha lehetővé teszi az alkalmazások számára, hogy futásidőben cseréljék ki és használják fel a funkciókat, ez elősegíti a méretezhetőséget, mivel lehetővé teszi a különböző csapatok számára, hogy független alkalmazásokon dolgozzanak.
Amikor a közös funkciók megváltoznak, nem kell megterveznie és telepítenie a fogyasztókat, mivel támogatja az örökzöld funkcionalitást.
A program beállítása után monolitként fog működni, ami fantasztikus.
A megosztható függőségek az alkalmazások méretének csökkentésére szolgálnak. Mivel sok fejlesztő már ismeri a Webpack környezetet, a fejlesztői tapasztalat kiváló.
Hagy egy Válaszol