1.01 (1) SSR, SSG, SPA czy MPA?
1.01 SSR, SSG, SPA czy MPA? W pierwszym odcinku podcastu PiwnicaIT rozmawiamy o różnych podejściach do tworzenia aplikacji webowych. Poruszamy tematy związane z SPA, SSG, SSR czy MPA w ujęciu webdevelopmentu. Omawiamy nasze doświadczenia w pracy z różnymi bibliotekami i frameworkami dostępnymi na rynku. Materiały dodatkowe: Qwik Svelte How to pick Web Framework in 2023 NextJS Gatsby React 10 Rendering Patterns for Web Apps Rozmawiają: Wojciech Skorupa [linkedin] Mateusz Jabłoński [www] [linkedin]
Tak naprawdę od tego nie uciekniemy. Co myślisz? Masz rację Mateuszu, jest to rzecz nieunikniona. Myślę, że każdy deweloper słyszał o takich frameworkach jak chociażby Next.js czy Gatsby. Myślę, że jest to fajne o tyle, że oferują one naprawdę coś specjalnego i coś czego tak naprawdę nie da się na razie jeszcze natywnie osiągnąć za pomocą Reacta. I rozwiązujemy realne problemy, z którymi boryka się, czy też borykają się takie nowoczesne aplikacje w sieci. Takie nowoczesne aplikacje w sieci.
Kolejną rzeczą, która myślę, że też robi dla mnie dużą robotę to jest Developer Experience. Z perspektywy dewelopera podoba mi się to co mówisz. Zdecydowanie mi się podoba, bo nie powiedziałem, że chciałbym pracować z czystym HTML czy CSS.
Zdecydowanie wolałbym pracować tak, jak pracuje. Mateusz, teraz to już jest wszystko nagrane. Tak, ale fakt faktem nadal podtrzymuję, że klient, który do Ciebie przychodzi, bardzo często zaczyna od MVP. Jak zrobisz mu Stronę internetową z Nextem w architekturze komponentowej, do tego dorzucisz jakiś headless CMS i wiesz, wszystko pięknie, ładnie, do tego wiesz, wszystko będzie cudnie napisane, a jeść można będzie z tego, tak? To w pewnym momencie się okaże, że on zapłaci naprawdę horrendalną kwotę za narzędzie, którego nie wykorzysta Więc czasami wydaje mi się, że z perspektywy takiej czysto biznesowej ten developer experience też jest ważny.
Przy takiej konfiguracji Wordpressa chociażby, czy WIXa, czy cokolwiek innego, ty już masz out of the box tak naprawdę, pewne narzędzia już dodane, więc jest to łatwiej złożyć. Więc mi się wydaje, że nasza różnica zdań w tym momencie, Wojtku, polega na tym, Że my się zgadzamy co do tego, że React jest spoko i że Developer Experience jest naprawdę na najwyższym poziomie i że jak robić, to nie robić babola, tylko od razu zrobić coś porządnie. I się zgadzamy z tym. Natomiast różnica jest chyba w tym miejscu, gdzie pojawia się ten biznes. Ja stoję na stanowisku, że klient jak do nas przyjdzie, to na bank nie będzie wiedział czego chce, a jeżeli chcemy podejść do niego uczciwie,
Więc tak naprawdę może, jeżeli chciałbyś z React, nie mam doświadczenia akurat w Gatsbym, nie wiem czy masz jakieś, natomiast nie wiem jak się szybko pisze w Gatsbym, Natomiast jeżeli się pisze szybko, to może Gatsby też jest takim właśnie narzędziem, które byłoby gdzieś tam pomiędzy mną a tobą. Pomiędzy tym moim podejściem, które stara się skupić na tym, co potrzebuje klient, nie mówię, że tego nie chcesz zrobić, Że bardziej skupiasz się na tej drugiej części, tym Developer XP. To znaczy, wiesz co Mateusz, ja mam wrażenie, że my się zgadzamy, tylko trochę patrzymy na inne strony tego samego problemu. Bo ty mówisz właśnie o czasie i tym, jak szybko możemy dostarczyć temu klientowi tak naprawdę tą stronę.
I porównując Nexta na przykład z Gatsbym, wydaje mi się, że większość wybierze Nexta, bo Next więcej oferuje. Więc ten Developer Experience daje większą swobodę. To podejście hybrydowe da nam większą swobodę niż przy Gatsbym. Zgadzam się z Tobą. Mamy narzędzie Gatsby'ego jako Do tego miejsca, w którym Gatsby jest, czyli do budowania prostych, szybkich, dynamicznych stron, to tutaj może się pojawić ta rozbieżność. Czy to będzie bardziej MPA, czy to będzie bardziej SSR? Nie chodzi nam o całą technologię, o podejście do technologii, tylko bardziej, w którą stronę to przypisać. Więc biznesowo ten Gatsby mi się nie klei.
Zgadzam się z Tobą. Poza tym, jeśli już zostałem tutaj takim adwokatem właśnie tego developer experience, że tak powiem, To dobrze. Zdecydowanie. Bardzo jestem zaszczycony, że wiesz, trafiłem właśnie na takie stanowisko. W każdym razie jeśli chodzi o samego Gatsby'ego myślę, że właśnie Nie zapewnia on niczego, czego nie zapewniałyby te frameworki takie jak właśnie Next czy Remix, a dodatkowo generuje jakieś dodatkowe problemy w tym, że jest to skomplikowane jak na wartość, którą proponuje. Dodatkowo jeszcze w rzeczach takich jak Next czy Remix
No dobra, a pozostali gracze? Mamy Nexta, o którym sobie już cały czas rozmawialiśmy. Mamy Gatsby'ego, który cały czas nam się przewija, ale na rynku są też inni gacze. Właśnie tak jak wspominałeś Remix, Svelte, chociażby Quick, o którym też mówiłeś. Czy w ogóle są w stanie dostarczyć coś wartościowego? Z mojej perspektywy, jak tak przeglądałem sobie chociażby Svelte, to dla mnie to nie jest developer experience na najwyższym poziomie. Bardziej przypisałbym to może do jakiegoś... Bardziej mi przypomina to Vue niż React.
Może dlatego, że jestem bardziej przyzwyczajony do koncepcji pisania w React czy w Angularze. To jest mi po prostu o wiele łatwiej ogarnąć te dwie koncepcje niż tą koncepcję tworzenia widoków we Vue. Natomiast fakt faktem mnie na przykład osobiście nie przekonują. A co ty myślisz o nich? Czy w ogóle jest dla nich miejsce na rynku? To znaczy, Matusiu, wiesz co? Myślę, że nie mieszałbym do tego naszego worka, który sobie dzisiaj stworzyliśmy właśnie z Felte, który zdecydowanie... Ja też nie widzę na razie wartości, chociaż słyszałem o nim dużo dobrego od innych deweloperów i właśnie ten developer experience, o którym dzisiaj tak dużo mówimy, dużo deweloperów docenia właśnie ten framework.
Tak, więc myślę Mateusz, że nie wrzucę bym Swelta do jednego worka, bo jest to o tyle problematyczne, że to jest trochę inna rzecz, ale jeśli chodzi o Developer Experience, o którym właśnie wspominasz, słyszałem dużo dobrego od innych deweloperów i wiele osób sobie chwali te rozwiązania, które tam są, chociaż mi osobiście on też nie bardzo się podoba i tak jak wspominałeś przypomina Vue, które też nie bardzo mi się podoba. Więc jest to rzecz zdecydowanie ciekawa. Jeśli chodzi o inne technologie, takie jak Remix chociażby, jest on bardzo ciekawy i osobiście chyba najbardziej mi się podoba. Jeśli ja miałbym dzisiaj właśnie stworzyć taki projekt SSR-owy powiedzmy, to właśnie skorzystałbym z Remixa.
I każda taka strona... Rozumiem, że na razie nie musisz tego robić, tak? Ale bo na razie masz wybór. Jeszcze inny wybór, tak, ale w momencie, kiedy nie będziesz miał innego wyboru, to kto, wiesz, i wszystkie, no. Pamiętasz, jak było z Reactem, jak Angular pojawił się na rynku i ludzie mieli dylemat, bo na rynku był Angular i React i długo, długo nic. Nic. A te stare frameworki i wszystkie X, JS i tak dalej wypadały powoli. Jak ludzie mieli dylemat, korporacje miały dylemat, co wybierać, to na co patrzałem? Na to, nie jaki jest próg wejścia, jaki jest developer experience, tylko jakie są przepisy związane bezpośrednio z danym frameworkiem, z danym narzędziem.
Super ciekawy pomysł na nie jako startup, czyli stworzenie właśnie takiego frameworku czy też biblioteki tak dużej, że wiesz może się przerodzić to w taką dużą firmę, tak jak to było z Nexem czy ze Stripe'em, więc spoka rzecz. Czyli co, ty dzisiaj byś wybrał Nexta? Jeśli byś pisał taką właśnie stronę, miałbyś takie wymaganie stworzenia takiej strony w stylu SSR? Jeśli bym pisał stronę internetową na przykład dla naszego podcastu i miało to być SSR, to wybrałbym Nexta, bo Developer Experience mi się podoba. Aczkolwiek Nie pracowałem z Remixem, a wiem, że bardzo go chwalisz, więc może.
Może to jest dobry moment. Może to jest dobry moment. Kto wie, możemy spróbować. Spróbować coś napisać razem i na jakimś żywym produkcie to wykorzystać. Natomiast tak teraz jeszcze chodzi mi po głowie jedna kwestia. No bo rozmawiamy sobie o tym SSR-ze, rozmawiamy sobie o SSG i SPA, rozmawiamy o tym, jaki to ma wpływ tak naprawdę na pozycjonowanie, na developer experience, na media społecznościowe, jak użytkownicy to wybierają, a jaki to ma wpływ na performance. Zastanawiałeś się nad tym? Czy te wszystkie wskaźniki performance'owe, takie jak np. time to first byte albo
Nie wiem, czy ty masz inne doświadczenia? Ogólnie też user experience, prawda? Bo też nie chcesz... O właśnie, to powinno wybrzmieć. No zgadzam się, tak. Te czasy, które musimy osiągnąć, bo też o tym często nie myślimy. Jak tworzysz aplikację biznesową, to nie myślisz o tym, ile ten biznesowy klient będzie czekał, bo ten czas nie jest tak istotny. Oni są przyzwyczajeni niestety do tego, że ta aplikacja się często ładuje i rozwiązaniem najczęstszym problemów jest po prostu jakiś loaderek, pach pach, pomieli, pomieli, działa, jest okej. Natomiast przy takim kliencie indywidualnym, to ok, SEO to jest to jak my się widzimy w internecie, jak nas widzą w internecie, jak łatwo mogą nas znaleźć, ale klienta możemy stracić, nie tylko go pozyskać lub nie pozyskać, możemy go też stracić.
Nie wiem, czy miałeś przyjemność z Pryzmikiem pracować? Prismic działa w ten sposób, że tworzysz sobie, pomijam szatę graficzną, która jest, że tak powiem, okropna i ten user experience po stronie Prismica jest taki sobie. Natomiast to, co on daje, on daje tak naprawdę użytkownikowi biznesowemu, temu, który będzie de facto content managerem. Daje mu możliwość za pomocą tego uwielbianego przez wszystkich użytkowników drag and dropa Ustawianie kolejności wyświetlania komponentów w aplikacji reactowej. Więc my tak naprawdę generujemy sobie jakieś komponenty, przygotowujemy je do developmentu, znaczy przygotowujemy je w procesie developmentu, dostarczamy je do aplikacji i content manager sam podejmuje decyzję, jak ta strona będzie zbudowana, z jakich komponentów, z jakiej kolejności będą one wyświetlone i z jakimi danymi.
Więc to ma też sens, to też jest rozwinięcie, trochę odpowiedź na to, co robi WordPress, że z jednej strony my tworzymy aplikację, czy to SSR, czy to SPA, czy to SSG, podpinamy w to jakiś tam system CMS-owy i wychodzimy tak naprawdę, możemy czerpać oczywiście z korzyści, czyli z tych wszystkich zalec, które dadzą nam poszczególne podejścia w zależności od wybranej drogi, ale możemy czerpać też Zyski z zalet tego, co dawał nam wcześniej WordPress ze swoimi znienawidzonymi przeze mnie pluginami typu Elementor. Więc tak naprawdę wydaje mi się, że to jest, gdzieś to się dzieje, że ten WordPress... Pojawiają się narzędzia nawet z tej części, którą my sobie pod kątem Developer Experience, że tak powiem, wybieramy i pod kątem rzeczywiście wydajności, no bo te aplikacje reactowe
A tutaj jednak ten deweloper jest potrzebny. Ktoś ci musi opracować te komponenty. Wojtku, podsumowując. Wydaje mi się, że stoimy obaj na stanowisku, że bardzo wartościową rzeczą w przypadku każdego z tych trzech podejść, o których dzisiaj rozmawialiśmy jest to, że developer experience przy każdym z tych podejść będzie stał na o wiele wyższym poziomie niż budowanie aplikacji z wykorzystaniem aplikacji typu MPA, gdzie frontend jest wbudowany w backend. Wydaje mi się też, że chyba się zgodzimy co do tego, że wybieranie pomiędzy SSR, SSG a SPA jest bardziej kwestią biznesową niż kwestią deweloperską, ponieważ każda z tych aplikacji ma trochę inne cechy, trochę inny performance, trochę inne czasy dostarczenia i tak naprawdę biznesowo to się musi spinać.
Pokazano wszystkie 17 dopasowań. Transkrypcja generowana automatycznie i niesprawdzana ręcznie — może zawierać błędy.
Mateusz przedstawia gościa, Wojtka, JS-owego ogarniacza.
Mateusz wprowadza w temat Server Side Rendering (SSR).
Wojtek i Mateusz dyskutują o SSR, jego przyszłości i zastosowaniach.
Wojtek i Mateusz poruszają temat porównania SSR, SPA i SSG.
Rozmowa o zastosowaniach technologii w zależności od projektu.
Wojtek i Mateusz dyskutują o wyborze technologii dla projektu MVP.
Rozmowa o porównaniu Nexta i Gatsby'ego.
Wojtek i Mateusz poruszają temat innych technologii takich jak Svelte i Remix.
Rozmowa o monopolie technologicznym i wpływach na wybor technologii.
Rozmowa o innych technologiach takich jak Vue i Angular.
Rozmowa skupiła się na porównaniu technologii front-endowych, takich jak SSR, SSG, SPA i MPA, pod kątem wydajności, SEO i developer experience.
Diskussja na temat przyszłości WordPressa jako platformy do tworzenia stron internetowych, porównanie z innymi technologiami i propozycje alternatyw.
Rozdziały i streszczenia generowane automatycznie. Pełna transkrypcja nie jest publikowana — wyszukaj frazę, aby zobaczyć dopasowane fragmenty.
Kliknij, aby znaleźć fragmenty, w których pada.
1.01 SSR, SSG, SPA czy MPA?
W pierwszym odcinku podcastu PiwnicaIT rozmawiamy o różnych podejściach do tworzenia aplikacji webowych. Poruszamy tematy związane z SPA, SSG, SSR czy MPA w ujęciu webdevelopmentu. Omawiamy nasze doświadczenia w pracy z różnymi bibliotekami i frameworkami dostępnymi na rynku.
Materiały dodatkowe:
Qwik Svelte How to pick Web Framework in 2023 NextJS Gatsby React 10 Rendering Patterns for Web AppsRozmawiają:
Wojciech Skorupa [linkedin] Mateusz Jabłoński [www] [linkedin]