Progressive Web App z WordPress : za i przeciw

4 Min.
Progresywne aplikacje internetowe WordPress

Nasz partner z agencji giftGRÜN zbudował Progressive Web App (w skrócie: PWA) z WordPress dla Szpitala Uniwersyteckiego RWTH Aachen, który wspiera onboarding nowych pracowników. Rozmawialiśmy z Patrickiem Heinkerem o zaletach i wadach PWA w porównaniu z witrynami internetowymi i aplikacjami natywnymi.

Jak działa progresywna aplikacja sieciowa

Patrick, jak dokładnie działa PWA i co z zarządzaniem danymi?

Zawartość jest przechowywana w WordPress i wyprowadzana za pomocą zwykłych szablonów. ServiceWorker zapewnia funkcjonalność w trybie offline. Przy pierwszym otwarciu strony ServiceWorker pobiera plik zip ze wszystkimi stronami, który jest generowany po stronie serwera.

Teraz, gdy strona jest wywoływana, wyświetlana jest strona, która już znajduje się w pamięci podręcznej. A ServiceWorker dba o aktualizację w tle, tak aby przy następnej wizycie pokazać nową zawartość, jeśli coś się zmieniło. Opcjonalnie, możesz również przeładować po aktualizacji, ale nie było to konieczne w naszym przypadku użycia.

PWA WordPress
Zrzuty ekranu z aplikacji Progressive Web App dla szpitala uniwersyteckiego RWTH Aachen

Przechowywanie danych odbywa się całkowicie offline, jedynie w przypadku filmów i treści zewnętrznych wymagane jest połączenie z Internetem.

PWA vs Native App

Jakie są różnice, ale i zalety w porównaniu z aplikacjami natywnymi?

Aplikacje natywne są specyficzne dla danej platformy, często skomplikowane, a przez to drogie w implementacji. Ponadto, muszą one być dystrybuowane za pośrednictwem oficjalnych sklepów dla dużego zasięgu. PWA, z drugiej strony, mogą być instalowane bezpośrednio podczas odwiedzania strony za pomocą jednego przycisku.

Jednak Apple wciąż pozostaje nieco w tyle ze wsparciem funkcjonalności PWA. Ale to nic nowego wśród web deweloperów, że Safari nie obsługuje rzeczy, które są powszechne w innych przeglądarkach od lat...

Jak wygląda interakcja pomiędzy Progressive Web App z WordPress ?

Używamy WordPress do utrzymania danych, ale także do szablonów. Jest to normalna strona internetowa, z tą różnicą, że jej zawartość jest udostępniana offline poprzez JavaScript ServiceWorker. I że zachowuje się prawie jak natywna aplikacja.

Istnieje również możliwość skorzystania z REST API strony WordPress i renderowania wszystkiego po stronie klienta, tak jak ma to miejsce w natywnych aplikacjach. Dla naszego przypadku użycia widzieliśmy tu jednak tylko dodatkowy wysiłek, który prawie nie przynosi żadnych korzyści.

Wdrażanie aplikacji Progressive Web App z WordPress

Jakie są podejścia, jeśli chcesz wdrożyć Progressive Web App z WordPress ?

Istnieje kilka Plugins, dzięki którym strona może zostać przekształcona w Progressive Web App za pomocą przycisku i kilku ustawień. Istnieją również usługi powiadomień push, które mogą być używane do powiadamiania wszystkich odwiedzających bloga o nowych postach. Jednak te gotowe Plugins są raczej przeznaczone do tego, aby uczynić normalnego bloga zdolnym do pracy offline i wstępnie załadować pliki docelowe.

Po pobawieniu się z niektórymi z tych Plugins , przeszliśmy do naszego własnego rozwiązania. Zbudowaliśmy naszą funkcjonalność oddzielnie od Plugins , aby umożliwić, na przykład, pełne ładowanie zawartości strony poprzez zip wygenerowany przez serwer i aby być bardziej elastycznym w dostosowywaniu funkcji. Powiadomienia Push są zazwyczaj odwzorowywane za pomocą płatnych usług, ale równie dobrze mogą być budowane we własnym zakresie.

PWA: kompatybilność i ochrona danych

Jakie są potencjalne pułapki i jak je rozwiązałeś? A co z kwestią ochrony danych?

Jak to zwykle bywa z tworzeniem stron internetowych: każda przeglądarka działa inaczej i trzeba je intensywnie testować na wszystkich urządzeniach. Apple odmawia pełnego wsparcia dla funkcjonalności PWA i ponownie ma swoje własne, specyficzne dla Apple meta tagi, aby aplikacja działała, które odbiegają od standardu.

Model buforowania powinien być wybrany tak, aby pasował do danego przypadku użycia. ServiceWorkery mogą wyprowadzać strony zbuforowane w milisekundach i odświeżać je w tle. Jednakże, jeśli jestem na stronie z wiadomościami, użytkownik może woleć zobaczyć mały pasek oczekiwania, aż do załadowania najnowszej zawartości.

Ochrona danych była jednym z głównych powodów, dla których zdecydowaliśmy się na PWA. Treści użytkowników i ich postępy w nauce są przechowywane całkowicie offline. Serwer nigdy nie widzi, który użytkownik co wywołuje, ponieważ nie ma zalogowanych użytkowników. Nie można więc sprawdzić, czy nowy pracownik wszystko już przerobił, czy nawet nie zainstalował aplikacji.

Zalety i wady systemów

Jak zdecydować, która technologia jest najlepsza dla danego projektu?

Istnieją aplikacje, które mogą być wdrożone tylko poprzez aplikację natywną. Na przykład, jeśli klient koniecznie chce powiadomień push na iPhone, to nie ma innej drogi niż natywna. Z drugiej strony, produkcja PWA jest również znacznie tańsza od aplikacji natywnej ze względu na wykorzystanie technologii webowych i wyeliminowanie całej obsługi sklepu. Oczywiście, decydującą rolę odgrywa również dostępny budżet.

Czy macie jeszcze jakieś inne projekty PWA w przygotowaniu, o których możecie nam opowiedzieć?

Sporo - ale nie chcemy ich jeszcze zdradzać 😉 Tylko tyle: wielkie rzeczy można zrobić z PWA także w sektorze e-commerce.

Kilka słów o Tobie i Twojej agencji?

giftGRÜN jest agencją digitalową w grupie GRÜN. Nasza grupa przedsiębiorstw jest wiodącym na rynku dostawcą systemów zarządzania darowiznami i członkami w Niemczech. Większość naszych projektów polega na stworzeniu całościowego systemu dla naszych klientów, tj. połączenie naszego systemu ERP z serwisami internetowymi.

Wykonujemy wiele prac związanych z interfejsami, a także rozwijamy nasze własne WordPress Themes . Nasz zespół składa się z projektantów, front- i backendlerów oraz project managerów. Nasz ulubiony hoster jest oczywiście z Münster 🙂

Twoje pytania dotyczące Progressive Web Apps

Jakie masz pytania dotyczące Progressive Web Apps? Zapraszamy do skorzystania z funkcji komentarza. Chcesz być informowany o nowych artykułach na WordPress i WooCommerce ? Następnie śledź nas na Twitterze, Facebooku, LinkedIn lub poprzez nasz newsletter.

Powiązane artykuły

Komentarze do tego artykułu

Napisz komentarz

Twój adres e-mail nie zostanie opublikowany. Pola obowiązkowe oznaczone są *.