• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Single page application - Czy warto? [ankieta]

Object Storage Arubacloud
0 głosów
822 wizyt
pytanie zadane 15 lutego 2019 w JavaScript przez Hunter94 Mądrala (6,290 p.)

Witam, chciałem Wam zadać pytanie zawarte w tytule czyli  "Single page application - Czy warto?"
Nie da się ukryć że temat SPA jest bardzo powszechny, są strony które prowadzą poradniki jak stworzyć taki serwis, ale tu dochodzę do pytania, nawet te strony które uczą, nie korzystają z SPA. 
Wiele popularnych serwisów nie korzysta z tej technologii. 
Mówi się że strony typu SPA są źle indeksowane przez Google z powodu problemu parsowania ich przez robota.
Tę informację słyszałem już parę lat temu, więc chciałem się Was zapytać jak to się ma w 2019?
Czy takie strony są gorzej indeksowane, czy może twórcy nie stosują tej technologii ze względu na jakieś inne powody.
Z góry dziękuje za odpowiedź smiley

Możliwe odpowiedzi:
Korzystam z SPA (12 głosów, 80%)
Unikam SPA (3 głosów, 20%)
komentarz 15 lutego 2019 przez Milesq Nałogowiec (32,020 p.)
To zależy ;)
1
komentarz 15 lutego 2019 przez Hunter94 Mądrala (6,290 p.)
Domyślam się że jeśli strona ma być spakowana jako aplikacja na smart-urządzenia to jak najbardziej jest to pożądane, W jakimiś zarządzaniu profilem również.

Ale co jeśli to zwykły serwis który dostarcza treść? np. kurs języka programowania.
Wydawałoby się że płynne przechodzenie pomiędzy danymi elementami kursu byłoby bardzo pożądane ale jak widać wiele stron które maja podobny use-case jaki ja chce zrobić, z tego nie korzysta.
komentarz 7 lipca 2020 przez Lebwa Nowicjusz (100 p.)

@Hunter94, Yes, SPAs are totally worth it. There's a reason why developers choose this approach. You can read more topic-related articles like here https://yojji.io/blog/spa-vs-mpa

komentarz 7 lipca 2020 przez Milesq Nałogowiec (32,020 p.)
Ten wątek ma rok.. I dlaczego piszesz po angielsku??

4 odpowiedzi

+5 głosów
odpowiedź 15 lutego 2019 przez Tomek Sochacki Ekspert (227,510 p.)

Moim zdaniem warto, jestem wielkim zwolennikiem jasnego rozdziału na client-side jako SPA i API jako pojedyncze endpointy. Rozwiązanie takie ma wiele zalet i wydaje mi się, że w porównaniu do "tradycyjnych" monolitów to nie ma tu w ogóle żadnych argumentów za monolitem.

Z takich najważniejszych zalet to:

  1. masz jasny rozdział front/API, można w ogóle zrobić sobie osobne repozytoria i wtedy zespół frontowy i backendowy w ogóle nie wchodzą sobie w paradę. Tak naprawdę w niektorych zmianach druga strona w ogóle nie musi o nich wiedzieć, choć raczej częściej dotyczy to zmian wizualnych na froncie, bo zmiany w API często jednak wymagają pewnych modyfikacji client-side, jakieś zmiany obsługi błędów itp.
  2. Znacznie latwiej zarządzać wg mnie monitoringiem takich aplikacji, co wg mnie powinno być jednym z priorytetów.
  3. po za samym core kodu to również testy są zupełnie niezależne
  4. no i rzecz bardzo istotna, front i API są rozdzielone i frontu kompletnie nie interesuje w jakiej technologii jest API i odwrotnie. API wystawia tylko konkretne endpointy, np. PUT z jakimś requestBody i front musi po prostu strzelić na ten endpoint. Nie ma natomiast kompletnie znaczenia czy API jest w Javie, PHP, node itp. oraz czy front jest w React, Angular itp. Daje też to możliwość migracji technologii w sposób niezależny. Jest to bardzo istotne, bo znacznie szybciej jest zmigrować np. jedną mikroaplikację kliencką z React na Angular niż migrować wszystkie mikroapki SPA od razu + backend jeśli ktoś korzystałby z systemu szablonów serwerowych itp.
  5. SPA daje możliwość lepszej pracy dla usera, zaczytuje on apkę raz (jak trzeba to można dodać lazy loading modułów) i potem tylko strzela do API. Nie ma ciągłego przeładowywania stron jak w monolitach.

Wiele osób zarzuca apkom SPA problemy z SEO co jest bzdurą, jak jest to istotne to po prostu dodaje się server side rendering i po sprawie. A ponad to google coraz lepiej sobie radzi z wykonywaniem JS i nawet jest w stanie pomalutku czytac sobie SPA bez SSR.

Ponad to w SPA jest znacznie przyjemniejsza obsługa wymiany danych między komponentami frontowymi. Na przykład podciągając rxjs (w Angular jest by default) możesz pracować w stylu reaktywnym co jest po prostu bajką, a w Angular masz by default dostępne reactive forms itp.

No i jeszcze jedna sprawa, mam wrażenie, że często pomijana przez ludzi na tym forum, mając samodzielny front znacznie łatwiej pozyskać z rynku ludzi wyspecjalizowanych typowo we froncie niż tzw. full stacków. I nie ma tu znaczenia czy ktoś pracuje w React, Angular itp. bo przemigrowanie się na inny framework to chwila. Na back-endzie natomiast mamy wtedy specjalistów stricte w języku serwerowym, np. Javie, PHP itp. 

I na koniec, również kwestia rzadko tutaj poruszana, a cholernie istotna, to mając niezależne apki znacznie łatwiej jest reagować na awarie. Wszelkie szybkie fixy, restarty instancji, dodawanie pamięci itp. są prostsze jak mamy wiele mniejszych klocków niż jeden monolit.

Także podsumowując to szczerze mówiąc nie widzę żadnych zalet monolitu nad SPA+API. Oczywiście mówimy tu o normalnych aplikacjach, nie o prostych stronkach z kilkoma-kilkonastoma podstronami itp. bo tu owszem można sobie spokojnie brać monolity i gotowce np. WP itp. Moja wypowiedź dotyczy aplikacji.

komentarz 15 lutego 2019 przez Comandeer Guru (601,110 p.)
Tylko że SPA nie ma absolutnie nic wspólnego z podziałem strony na front i API. SPA jest wyłącznie wyborem struktury architektury frontu i nie wpływa na to, w jaki sposób do aplikacji przekazywane są dane. Rozdział na front i API równie dobrze może przebiegać w przypadku MPA (Multiple-Page Application).
komentarz 15 lutego 2019 przez Tomek Sochacki Ekspert (227,510 p.)
ok, teoretycznie tak, ale generalnie to najczęściej jest to powiązane, czyli jak SPA+API vs monolit (i jakieś szablony serwerowe). Ale oczywiście, rozwiązań jest wiele jakby się wgłębić w temat.
+2 głosów
odpowiedź 15 lutego 2019 przez Comandeer Guru (601,110 p.)

Wszystko zależy od typu projektu. Jeśli tworzymy stronę, której główną funkcją ma być przekazywanie informacji, to pchanie się w SPA może nie być najlepszym pomysłem. Z kolei jeśli tworzymy zaawansowaną aplikację internetową, SPA może spełnić nasze oczekiwania. Osobiście wyszczególniam także usługi krytyczne, które powinny działać zawsze i w ich przypadku wykorzystanie architektury SPA musi być niezwykle ostrożne – tak, aby strona w pełni działała również w chwili, gdy JS nie zadziała.

Jeśli chodzi o indeksowanie, to warto zainteresować się techniką Server Side Rendering, która pozwala wygenerować stronę na serwerze. To równocześnie załatwia większość problemów z usługami krytycznymi oraz wydajnością przy pierwszym wczytaniu strony. Warto też się zapoznać z koncepcją middleendu.

komentarz 15 lutego 2019 przez Tomek Sochacki Ekspert (227,510 p.)

wydajnością przy pierwszym wczytaniu strony

no tu bym dyskutował... troszkę zbyt ogólnie powiedziane. W wielu przypadkach pewnie tak będzie, ale czasami masz aplikację, która na starcie SPA robi wiele strzałów do API, które czasami mogą trwać krócej/dłużej, zależy od ruchu, czasami jakiś chwilowych problemów z pojedynczymi endpointami (np. serwisami, które za nie odpowiadają) itp. W takiej sytuacji jeśli nie mamy SSR to można łatwo wrzucić "bazową" apkę i np. porobić choćby tzw. preloadery, jakieś komunikaty itp. W tradycyjnym SSR jaki często jest robiony to te strzały są w API (mówię tu o pełnym SSR, nie o cachowanym z wcześniej podgranych danych) i klient czeka aż np. ponowią się retry itp.

Oczywiście wszystko jest do ogrania, np. ustawienie jakiś maksymalnych timeoutów dla SSR i w razie czego puszczanie bez response z jakiegoś wadliwego API itp. Nie twierdzę więc, że SSR nie jest wydajne, tylko przetsrzegam, że trzeba to robić z głową :) Szczególnie, jeśli tych strzałów w API jest sporo i są one porozrzucane po różnych usługach, czasami różnie wyskalowanych itp. Już miałem styczność z sytuacjami, gdzie jakieś pojedyncze usługi łapały zawieszki bo coś się pomieszało na cache czy wpadły w jakieś pętle eventów i kolejek itp. Czasami są to elementy, bez których spora część apki może dalej działać, np. dać ładne info "sorry, mamy problem, idź na kawę i weź se potem kliknij w dokończ zakupy" :) Warto więc o wszystkich takich rzeczach pamiętać robiąc SSR.

+1 głos
odpowiedź 16 lutego 2019 przez BT101 Stary wyjadacz (12,540 p.)

Mówi się że strony typu SPA są źle indeksowane przez Google z powodu problemu parsowania ich przez robota. 
Tę informację słyszałem już parę lat temu, więc chciałem się Was zapytać jak to się ma w 2019? 

google crawlery są w stanie parsować i wykonywać kod JavaScript już od jakiegoś czasu. Google bot działa na Chrome 41, która potrafi wykonać kod JS.

Jedynym obostrzeniem jest fakt, że google chrome 41 jest starą wersją przeglądarki i trzeba dodać jakieś polyfille.

Na YT jest film omawiający ten temat od google.

Mimo to możliwe, że jakieś inne wyszukiwarki nie będą widziały treści ale przy małym projekcie (mała ilość dynamicznych linków) można użyć świetnego pluginu prerender-spa, który załatwia temat braku treści w 3 minuty. Przy dużej ilości dynamicznych linków trzeba wprowadzić SSR.

0 głosów
odpowiedź 16 lutego 2019 przez Ehlert Ekspert (212,670 p.)

W obliczu zachwalania SPA, pragnę tylko zwrócić uwagę na kilka rzeczy które do tej pory umknęły:

  • Rozbicie be i fe drastycznie wydłuża czas developmentu. 
  • Konieczność ogarnięcia obu technologii
  • Rozbicie powoduje konieczność napisania większej ilości testów
  • Końcowe testy funkcjonalne są trudne do zrealizowania
  • Z tym wszystkim związany jest również większy nakład prac CI/CD.

Nie jestem przeciwnikiem SPA, ale trzeba mieć świadomość powyższych rzeczy. 

1
komentarz 16 lutego 2019 przez Tomek Sochacki Ekspert (227,510 p.)
edycja 16 lutego 2019 przez Tomek Sochacki
  • Rozbicie be i fe drastycznie wydłuża czas developmentu. 

Ja właśnie twierdzę, że jest wręcz odwrotnie :) Przychodzi biznes z jakimś pomysłem X, zapada decyzja, że część rzeczy trzeba zrobić w API, i część we froncie. W tym momencie rozbicie na SPA-front i niezależne serwisy w API to doskonałe rozwiązanie. Grupa back-endowców robi sobie zmiany w API, a front w tym czasie robi swoje. Jeśli potrzebuje pilnie dostać zwrotkę z API, która jeszcze się robi to po prostu sobie ją mokuje i po sprawie... jak jest back-end to go wdrażasz i łączysz z frontem... sam tak pracuję na co dzień i jest to właśnie wg mnie wielka zaleta SPA+API, czyli przyspieszenie developmentu, a nie jego spowolnienie :) Każdy ma swoje repozytoria, w ogóle nie mieszamy się w sprawy "tej drugiej strony"...

  • Konieczność ogarnięcia obu technologii

to już zależy od Ciebie, ja np. generalnie wolę siedzieć we froncie, ale jak trzeba coś skubnąć w API to też tragedii nie ma, ale praktycznie 90% moich znajomych jednak jest stricte nakierowana back-end OR front. Lepiej być specjalistą w jednym niż pół specjalistą we wszystkim... niech każdy robi swoją część :) A ponad to jeśli jeszcze API rozbijesz sobie na mniejsze klocki to możesz sobie łatwo testować inne technologie, języki itp.... w monolicie tego nie zrobisz.

  • Rozbicie powoduje konieczność napisania większej ilości testów

to znaczy? Przede wszystkim masz pelną dowolność wyboru pisania testów, front w ogóle nie wie o testach API i odwrotnie bo nie musi, są to kompletnie osobne byty. 

  • Końcowe testy funkcjonalne są trudne do zrealizowania

Miałem okazję jakiś czas temu być przy podobnej dyskusji właśnie z testerami i potwierdzają oni, że rozbicie na wiele małych usług jest znacznie lepsze do testowania niż monolity. Łatwiej też jest analizować jakieś statystyki i logi requestów itp. jak śledzisz sobie po konkretnych usługach niż po całym monolicie...

  • Z tym wszystkim związany jest również większy nakład prac CI/CD.

może i tak, ale są to prace, które robisz generalnie tak od zera tylko przy odpalaniu danej usługi czy dodawaniu kolejnych, potem tylko ewentualnie zarządzasz konfigami. Ale tu fakt, nakład jest większy, tylko pytanie czy na pewno chcemy to uznawać za wadę tak dużą?

komentarz 16 lutego 2019 przez Ehlert Ekspert (212,670 p.)

Ja właśnie twierdzę, że jest wręcz odwrotnie

Możesz twierdzić, że jest odwrotnie ale fakty są takie że rozbicie front-backend wydłuża development.

niech każdy robi swoją część :) 

To teraz tłumacz biznesowi że trzeba dodatkowo zatrudnić 2 programistów żeby było wygodnie i przyszłościowo.

front w ogóle nie wie o testach API i odwrotnie bo nie musi, są to kompletnie osobne byty. 

Co oznacza że testów trzeba napisać dwa razy tyle.

Łatwiej też jest analizować jakieś statystyki i logi requestów itp. jak śledzisz sobie po konkretnych usługach niż po całym monolicie

Mówiłem o automatycznych testach funkcjonalnych.

pytanie czy na pewno chcemy to uznawać za wadę tak dużą?

Oczywiście że tak. Większy nakład pracy to koszta. Plus zatrudnienie devopsa.

komentarz 16 lutego 2019 przez Tomek Sochacki Ekspert (227,510 p.)

To teraz tłumacz biznesowi że trzeba dodatkowo zatrudnić 2 programistów żeby było wygodnie i przyszłościowo.

nie no umówmy się, wyszedłem tu z założenia, że nie mówimy o jakiś mikro firmach zatrudniających kilku ludzi co robi proste wizytówki czy małe e-sklepy, bo tu to faktycznie takie rozbijanie może nie mieć sensu, moja wypowiedź odnosiła się raczej do większych aplikacji i moje zdanie potwierdza wielu znajomych co pracowali w róznych projektach, bankowych, ubezpieczeniowych, logistycznych itp. itd.

Plus zatrudnienie devopsa.

a to zależy :) u mnie w firmie to my jako programiści, którzy mają w utrzymaniu konkretne usługi w API i na froncie zajmujemy się całą tą "otoczką", my tworzymy i utrzymujemy plany np. na bamboo, CI, repo itp. itd. Zależy więc wszystko od podziału ról w firmie i zespole, jak się ludzie umieją dogadać to jest spoko, gorzej, jak nie umieją i każdy na siłe chce coś udowadniać innym, że jest najlepszy itp.

Ale nie ma co rozwijać offtopicu, tak reasumując to moją wypowiedź napisałem na podstawie własnych doświadczeń, gdzie pracuję w zespole złożonym właśnie z frontów i back-endowców i żyjemy w świecie mikroserwisów w API i wielu SPA na froncie i taki podział sprawdza się doskonale. Gdy mamy ustalone np. założenia biznesowe to back-end już może robić swoje, a ja z UX designerem mogę jeszcze spokojnie dogrywać kwestię makiet itp. Jest to znacznie szybsze niż praca w monolicie. Zresztą praktycznie wszyscy z kim rozmawiam twierdzą, że dawno temu wyjście w firmie z monolitu na rzecz takich rozdziaów to jedna z lepszych decyzji w firmie, co również znacząco przyspiesza development, wdrażanie itp.

Mając monolit to masz też utrudnione wdrożenia, zawsze wchodzisz od razu całą apką, a tak to masz to rozdzielone. I możesz mi wierzyć lub nie, ale po paru większych awariach na jakiś pojedynczych usługach doceniasz taki rozdział nawet kosztem większego nakładu pracy na narzędzia do buildów itp. :)

komentarz 16 lutego 2019 przez Ehlert Ekspert (212,670 p.)

Jest to znacznie szybsze niż praca w monolicie.

Tak, tylko masz przy tym 5 ludzi, zamiast 2. 

komentarz 16 lutego 2019 przez Tomek Sochacki Ekspert (227,510 p.)
akurat bardziej myślałem o projektach nieco większych, gdzie tych ludzi jest kilkadziesiąt lub więcej :) ale nawet przy tej 5 vs 2 to tak nie do końca... no chyba, że firma jedzie na granicy...

A co jak z tych 2 jeden Ci się zwolni, zachoruje itp. zostawisz całą aplikację na głowie drugiego...? Czyli wszystkie sprawy związane z nowymi ficzerami, utrzymaniem, awariami, monitoringiem itp. itd....? Z tego co rozmawiam czasem z ludźmi to raczej firmy podobno starają się myśleć strategicznie w tych kwestiach, kumpel, który pracowal w jednym z banków to nawet sam twierdzi, że wręcz nieco z przesadą bo wg niego jest aż nadto ludzi, ale z drugiej strony sam przyznaje, że jak była "wyjebka" to taki nadmiar rąk nikomu nie zaszkodził :) Także kwestia ilości osób to nie tylko czas samego developmentu... :)
komentarz 17 lutego 2019 przez Ehlert Ekspert (212,670 p.)
Zakładasz jakieś dziwne scenariusze. Nie biorę pod uwagę zwolnień, wyjebek czy rozkimn w stylu 5 devów vs 2, mieć czy nie mieć. Musisz patrzeć na takie problemy przez pryzmat rzeczywistości. Nie wszystkie firmy idą w mikroserwisy, nie wszędzie się one nadają.

Prosty case: logowanie rejestracja i dwa Crudy. Prawda jest taka że separacja zajmie więcej czasu.

Podobne pytania

0 głosów
1 odpowiedź 188 wizyt
pytanie zadane 24 marca 2021 w JavaScript przez Jakub 0 Pasjonat (23,120 p.)
0 głosów
1 odpowiedź 335 wizyt
pytanie zadane 14 lutego 2018 w JavaScript przez Mateusz Wandzel Nowicjusz (120 p.)
0 głosów
1 odpowiedź 179 wizyt
pytanie zadane 19 lutego 2020 w Offtop przez JakSky Stary wyjadacz (14,770 p.)

92,568 zapytań

141,424 odpowiedzi

319,630 komentarzy

61,956 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Kolejna edycja największej imprezy hakerskiej w Polsce, czyli Mega Sekurak Hacking Party odbędzie się już 20 maja 2024r. Z tej okazji mamy dla Was kod: pasjamshp - jeżeli wpiszecie go w koszyku, to wówczas otrzymacie 40% zniżki na bilet w wersji standard!

Więcej informacji na temat imprezy znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...