Progressive Web Apps (PWA) w Magento – wszystko, co powinieneś wiedzieć
Odkąd w roku 2015 projektant Frances Berriman oraz inżynier Alex Russel ukuli termin PWA (progressive web apps), szum wokół tego pojęcia jedynie rośnie. Dzięki temu rozwiązaniu zaciera się granica między aplikacjami natywnymi a stronami wyświetlanymi na mobile. Wiele firm zaczęło dostrzegać pozytywne efekty korzystania z aplikacji PWA. Nadeszła pora, aby z takich korzyści odnieśli pożytek także sprzedawcy internetowi.
Artykuł ten wyjaśnia, czym jest PWA oraz dlaczego warto zaimplementować to rozwiązanie dla swojego sklepu Magento.
Czym jest PWA?
PWA to najprościej rzecz ujmując aplikacja webowa, która ładuje się jak zwykła strona internetowa, ale jednocześnie pozwala korzystać z funkcji typowych dla aplikacji mobilnych. Użytkownik ma do niej dostęp z poziomu przeglądarki internetowej, więc nie musi pobierać osobnej aplikacji na swoje urządzenie. Takie rozwiązanie oferuje poszerzone możliwości analityki oraz tworzenia wyjątkowego user experience. Jednymi z większych zalet takiego rozwiązania są: szybszy czas ładowania, większe zaangażowanie użytkownika oraz brak konieczności tworzenia osobnych aplikacji na poszczególne systemy.
Samo znaczenie skrótu można przedstawić następująco:
- Progressive – bo korzysta z rozwiązania lazy loading. Polega to na tym, że wybrane elementy strony (jak zdjęcia) ładują się dopiero w momencie, gdy użytkownik strony przewinie do ich miejsca.
- Web – gdyż strony PWA są pisane w językach typowych dla Internetu jak HTML, CSS oraz JavaScript.
- App – bo kod stron PWA działa na urządzeniach mobilnych.
4 najważniejsze cechy PWA
PWA ma wiele kluczowych elementów, które rozróżniają to rozwiązanie od tradycyjnych stron internetowych oraz aplikacji natywnych.
- Pełna responsywność oraz kompatybilność na wielu przeglądarkach
PWA korzysta z zasad progresywnego ulepszania. Dzięki temu podstawowe funkcjonalności oraz zawartość stron jest dostępna dla każdego bez względu na to, z jakiej przeglądarki korzysta. Strony PWA działają zatem na wszystkich popularnych przeglądarkach i są w pełni responsywne na każdym typie urządzenia. iOS od wersji 11,3 także posiada wsparcie dla PWA. Brakuje jedynie powiadomień push czy też integracji z Siri.
- Szybkość i bezpieczeństwo
Strony PWA są budowane z wykorzystaniem wielu technik optymalizacji, dzięki czemu działają niezwykle szybko. Oprócz tego wszystkie aplikacje tego typu są obsługiwane przez HTTPS, co zapewnia odpowiedni poziom bezpieczeństwa.
- Powiadomienia typu push
PWA pozwala na korzystanie z powiadomień push. Z punktu widzenia sprzedaży w Internecie są one bardzo korzystne. Pozwalają informować o aktualnych ofertach, śledzić zachowania klientów, ułatwiać ścieżkę zakupową czy też przeprowadzać retargeting.
- Łatwy dostęp
Aby korzystać ze strony stworzonej dzięki PWA, nie trzeba pobierać konkretnej aplikacji ze sklepu. Samą aplikacją można podzielić się przez link, odwiedzić stronę docelową w przeglądarce i zapisać ją w ulubionych lub utworzyć do niej skrót umieszczany na ekranie głównym.
5 korzyści wynikających z korzystania z PWA
Korzyści dla właścicieli sklepów:
- Oszczędność kosztów
Progressive Web Aps korzystają w procesie tworzenia z web stacków, czyli narzędzi i rozwiązań przeznaczonych do tworzenia stron internetowych. Efektem tego jest oszczędność kosztów oraz większa efektywność. Oprócz tego same aplikacje działają zarówno na urządzeniach iOS, jak i Android. Dzięki temu nie trzeba inwestować środków na tworzenie osobnych aplikacji na różne platformy.
- Oszczędność czasu
Wspomniane działanie aplikacji na różnych typach urządzeń oszczędza także czas. Nie trzeba tworzyć kolejnej wersji aplikacji, aby dotrzeć na nowy rynek.
Korzyści dla użytkowników:
- Niskie zużycie danych
W porównaniu do aplikacji natywnych PWA ma bardzo małe zużycie danych. Dzięki temu taka strona może działać efektywnie nawet wtedy, kiedy użytkownik ma słabe łącze internetowe.
- Brak potrzeby aktualizacji
Strona zbudowana dzięki PWA jest ciągle aktualna – użytkownicy nie muszą pobierać aktualizacji, aby skorzystać z nowych funkcji albo doczekać się działania patchu. Rozwiązuje to także problem fragmentacji oprogramowania, gdyż nie musisz utrzymywać starszych wersji aplikacji.
- Szybkie ładowanie
Ładowanie się stron PWA jest 2-3 razy szybsze niż przeciętnych responsywnych stron.
PWA rozwiązuje jednocześnie dwa problemy
Jak pokazuje badanie przeprowadzone przez Forrester oraz National Retail Federation, konwersja na aplikacjach natywnych wynosi 6%. Na stronach wyświetlanych na komputerach osobistych plasuje się ona na poziomie 4,2%. Najgorszy wynik osiągnęły mobilne wersje stron sklepów internetowych – 2,3%.
Jaki z tego wniosek? Wysokiej jakości aplikacje natywne (na przykład taka, z jakiej korzysta Amazon.com) dają wspaniałe rezultaty. Zapewniają wygodę zakupów, a samo user experience jest lepsze niż w przypadku tradycyjnego desktopu.
Problem tkwi w tym, że stworzenie aplikacji natywnej jest bardzo drogie. Po drugie, taką aplikację pobierają jedynie użytkownicy, którzy mają już zaufanie do marki i są gotowi na regularną interakcję z nią. Rozwiązanie to jest zatem dobre dla wielkich przedsiębiorstw z dużymi budżetami na rozwijanie rozwiązań mobile lub z liczną bazą klientów. Dla przeciętnego sprzedawcy tworzenie aplikacji natywnej może nie mieć sensu z biznesowego punktu widzenia.
I właśnie tutaj w grę wchodzi PWA. Oferuje ono user experience typowe dla aplikacji do pobrania, jednak korzysta w tym celu z technologii web developmentu. Jest to świetne rozwiązanie dla sprzedawców, którzy notują coraz większy ruch na urządzeniach mobilnych. PWA rozwiązuje dwa problemy:
- Oferuje zwiększoną wydajność oraz user experience, co przekłada się na większą konwersję użytkowników na urządzeniach mobilnych.
- Usuwa konieczność tworzenia drogiej aplikacji natywnej.
PWA wychodzi naprzeciw kolejnemu zjawisku:
Jak wiele nowych aplikacji mobilnych instaluje użytkownik każdego miesiąca?
Badanie przeprowadzone przez Comscore pokazało, że miesięcznie niemal połowa użytkowników nie pobiera żadnej aplikacji. Jedynie 8% pobiera przynajmniej 3 nowe aplikacje. Widocznie użytkownicy nie mają takiej potrzeby – badanie wykazało także, że 90% całego czasu spędzonego na aplikacjach mobilnych przypada jedynie na 5 ulubionych z nich.
Ten trend jest podobny zarówno na Androidzie, jak i iOS. Obejmuje wszystkie grupy demograficzne. Użytkownicy widocznie nie lubią lub nie mają potrzeby pobierać nowych aplikacji i wystarczą im praktycznie te, które już mają.
Jaki z tego wniosek? Aplikacja mobilna niewątpliwie przynosi duże korzyści z punktu widzenia konwersji oraz user experience. Jednak doprowadzenie do jej pobrania to bardzo wymagające zadanie, które będzie zapewne coraz trudniejsze.
Przeciętny użytkownik na pewno odwiedza średnio znacznie więcej stron internetowych, niż pobiera nowych aplikacji. Dlatego najlepiej połączyć ten fakt z korzyściami, jakie dają aplikacje natywne. Odpowiedź? PWA.
Jednym z większych wyzwań dla każdego oprogramowania jest także jego dystrybucja. PWA nie ma z tym problemu, gdyż po prostu działa. Każdy użytkownik mobilny skierowany na Twoją stronę może odnieść z tej technologii pożytek.
PWA w akcji – konkretne przypadki, w których zastosowanie PWA przyniosło korzyści
Przyjrzyjmy się przykładom, w których większe i mniejsze przedsiębiorstwa zainwestowały w PWA i odniosły z tego wiele korzyści:
Dzięki PWA resort zwiększył konwersje na Black Friday o 53%.
Popularna porównywarka hoteli po wprowadzeniu PWA zanotowała wzrost w zaangażowaniu użytkowników o 150% oraz o 97% więcej kliknięć kierujących do ofert hoteli.
Strona internetowa znanego magazynu wykonana dzięki PWA ładuje się w 2,5 sekundy. Starsza wersja potrzebowała na to aż 6,5 sekundy.
3 miesiące po tym, jak Pinterest zmodernizował swoją stronę, używając do tego technologii PWA, zanotował on niesamowite rezultaty. Odwiedzający zwykli czekać 23 sekundy, zanim elementy user interface zaczęły w pełni działać. Teraz zajmuje to jedynie 5,6 sekundy. Oprócz tego udało się zredukować ilość pobieranych treści, które nie były w danym momencie potrzebne użytkownikowi o 90%.
Wersja PWA BookMyShow jest 54 razy mniejsza niż aplikacja na Androida i 180 razy mniejsza niż wersja na iOS.
Żeby nie było tak różowo
Jak wykazuje ten artykuł, z PWA związane jest mnóstwo korzyści. Trzeba jednak wspomnieć także o kilku wadach, które należy wziąć realistycznie pod uwagę. Po pierwsze PWA jest stosunkowo nowym rozwiązaniem samo w sobie, a zwłaszcza w przypadku Magento. Efektem tego są duże koszty wdrożenia. Ceny rosną zwłaszcza podczas tworzenia dedykowanych rozwiązań.
PWA ma także ograniczone możliwości korzystania z niektórych funkcjonalności telefonu jak skaner linii papilarnych.
Wdrożenie PWA to także przedsięwzięcie długoterminowe i odpowiedzialne. Celem jest stworzenie aplikacji, która będzie działała na wielu systemach operacyjnych i przeglądarkach. Konieczne są także przyszłe modernizacje. Początkowy koszt wymaga zatem stworzenia całego fundamentu pod nowoczesne rozwiązanie, a także jego dalszy rozwój.
Podsumowanie
Obecnie dostrzegamy trend, gdzie nowi użytkownicy nie są chętni do pobierania nowych aplikacji. Z drugiej strony oczekują coraz lepszego user experience, które zwykle dać może jedynie dobra aplikacja natywna.
Zainwestowanie w wersję PWA swojego sklepu Magento jest zatem jedną z lepszych decyzji, jaką możesz podjąć z długoterminowej perspektywy. Technologia oferuje nie tylko świetne korzyści już na starcie, ale jest jednocześnie przystępna w implementacji i oszczędna.