Składamy frontend z wielu mikrofrontendów. Module Federation czy Web components?

Cześć, tu Aleks. Cześć, tu Kuba. Dzisiaj będziemy rozmawiać o mikrofrontendach, powiemy sobie czym są, jak można je zaimplementować, no i jak widzimy przyszłość. Zapraszam na odcinek Subiektywnego Frontendu. Zapraszamy. W dzisiejszym odcinku porozmawiamy o mikrofrontendach. Czym są mikrofrontendy? Skąd się to wzięło? Mikrofrontendy są to aplikacje webowe, które są rozwijane oddzielnie, ale serwowane razem jako jedna aplikacja webowa. Tak, czyli w sumie takie tyci fronty, tyci aplikacje, które komponują się na większą aplikację. Więc użytkownik widzi to jako jedną aplikację, powiedzmy single SPA, albo ogólnie jedną aplikację.

Czyli jak go robi, to upraszcza to. Upraszcza dynamiczne ładowanie różnych komponentów w runtime. Tak jest. Oprócz tego mamy jeszcze na przykład single SPA, czyli framework, który pozwala Z tego co wiem i z tego co rozumiem bardzo podobnie działa jak Module Federation, czyli też w runtime nie jesteś w stanie ładować różne mikrofrontendy, raczej różne aplikacje. Single SPA. Dość popularny. Korzystałeś? Nie, nie korzystałem. Ja też nie korzystałem. Chociaż z tym Single SPA to wydaje się dosyć ciekawa sprawa, bo to trochę czytałem, że Single SPA dostarcza właśnie ten kontener i on zajmuje się routingiem, bo routing jest problematyczny w takich aplikacjach.

Czyli jak mamy wiele komponentów i każdy by chciał odciągnąć w swoją stronę ten routing, to Single SPA dostarcza nam pewien set narzędzi, pewne takie Po prostu metody czy tam funkcje, które pozwalają to wszystko zintegrować, czyli posklejać, zbootstrapować aplikację i wtedy Single Spa ma swój własny life cycle, do którego aplikacja musi się dostosować i Single Spa tym zarządza, czyli jest takim po prostu rodzicem, który tam mówi, ty masz to robić, ty masz to robić. To jest też ciekawa koncepcja, ale wymaga od Ciebie... Ok, a w jaki sposób on wie, że to jest ta aplikacja, a nie inna? Jest taki manifest, czyli mikrofrontend musi się zarejestrować i musi stworzyć swój własny...

Tak, wewnątrz web componentu, czyli on jakby mapuje importy. Nie może się odnosić bezpośrednio do Angulara. Tak, musisz po prostu zmapować te importy i wtedy on jest, czyli wtedy jesteś w stanie sobie to reużyć. No i oczywiście musisz załadować tę skrypkę. Czyli to nie jest tak, że to działa out of the box, tak jak Module Federation, tylko musisz wtedy podać, ok, załaduj mi teraz Angulara i dopnij mi go do tego obiektu. Ja z tymi web komponentami pracowałem, było fajnie, ale jest jedno ale, mianowicie routing, czyli one nie wspierają routingu, no bo są... By design są tylko elementami na stronie, czyli ten routing musi być wyrzucony do rodzica. Brzmi jak tutaj single spa kandydat, ale nie wiem jak to zintegrować. Tego aż nie robiłem, tak daleko nie zaszedłem.

Ok, ale miałeś ten routing na poziomie web componentu też? Miałeś jakąś komunikację, czy to były takie standalone web komponenty? Standalone, chociaż routing No i prościej, w przeglądarce Anchor, link po prostu. Linkiem dalej możesz nawigować, więc to jest takie bardzo proste rozwiązanie, ale żeby skorzystać na przykład z dobroci i z Single Page Application, no to trzeba się już troszkę tam popocić. Szklana kula. Jak widzisz mikrofrontendy w przyszłości? To nie będzie coś, co będą mieli wszyscy. Ale to jest teraźniejszy w CQB. Nie no, to co widzę, jak widzę przyszłość, to to, że mikrofrontend nadal pozostaną jednak pewną niszą, jednak narzut technologiczny, czyli ilość dodatkowej pracy, którą trzeba wykonać, nie każdemu się opłaci, nie zawsze jest to potrzebne, szczególnie w małych projektach to w ogóle jest bez sensu, no jeśli zależy ci na szybkości, no bo musisz zrobić całe zarządzanie, czyli budowanie jakichś tam różne sztuczki, żeby to wszystko