Progressive web applications, znane również jako aplikacje progresywne i PWA, zyskują popularność głównie ze względu na zmieniające się wymagania i przyzwyczajenia użytkowników mobilnych. Jak działają progresywne aplikacje webowe i kiedy warto je tworzyć?
W 2015 roku Frances Berriman i Alex Russell stworzyli nowy typ strony internetowej, która zapewnia znacznie lepsze wrażenia użytkownika niż tradycyjne aplikacje webowe. Nazwali je określeniem „Progressive Web Apps”. Rok później, podczas konferencji Google IO, Eric Bidelman (Senior Staff Developers Programs Engineer) przedstawił PWA jako nowy standard w tworzeniu stron internetowych.
Spis treści
Co to jest PWA? Definiujemy progresywne aplikacje webowe
Progressive web applications są aplikacjami internetowymi, zapewniającymi podobne doświadczenia jak aplikacje mobilne. Użytkownik, korzystający z aplikacji progresywnych na smartfonie, w rzeczywistości używa strony internetowej, która wygląda, jak aplikacja mobilna. Nie jest to jednak dla niego oczywiste, bowiem okno wyszukiwarki i charakterystyczne elementy, jak np. pasek wyszukiwania są ukryte. PWA są napisane w JavaScript, CSS i HTML. Wyglądają i zachowują się jak zwykłe strony internetowe (co oznacza, że można je znaleźć w przeglądarkach internetowych). Zapewniają również funkcjonalności identyczne jak aplikacje mobilne: są szybkie, mogą pracować offline, wysyłać powiadomienia push i korzystać z funkcji urządzeń użytkowników.
Aplikacje PWA pozwalają na utworzenie skrótu na ekranie urządzenia, co umożliwia przeglądanie i korzystanie z większości funkcjonalności strony www bez dostępu do internetu. Takie rozwiązanie ułatwia więc dotarcie do szerszej liczby odbiorców.
Kiedy progresywne aplikacje webowe są najlepszym rozwiązaniem?
Jednym z głównych argumentów, przemawiających za tworzeniem aplikacji progresywnych jest stosunkowo szybka i tania realizacja. Aplikacje PWA są więc odpowiednim rozwiązaniem, jeśli bardziej zależy ci na czasie i optymalizacji kosztów niż na elementach natywnych.
Wśród najczęściej wymienianych zalet aplikacji progresywnych znajdziemy:
- Responsywność — aplikacja dostosowana jest do wszystkich urządzeń
- Możliwość działania w trybie offline (w ograniczonym zakresie)
- Brak konieczności pobierania czy aktualizacji przez sklepy z aplikacjami, jak App Store czy Google Play
- Łatwa instalacja — wystarczy dodać ikonę aplikacji na pulpicie telefonu, nie ma więc konieczności wpisywania adresu URL w oknie przeglądarki
- Podobieństwo do aplikacji natywnych na urządzeniach mobilnych
- Możliwość łączności poprzez komunikację Bluetooth
- Wysokie bezpieczeństwo — progresywna aplikacja internetowa oparta jest o protokół HTTPS
Aplikacje progresywne są dobrym rozwiązaniem m.in. dla sklepów internetowych, bowiem aplikację można stworzyć tak, aby użytkownik mogł przeglądać ofertę sklepu w trybie offline i wykonywać proste operacje na danych, jak np. dodanie produktów do koszyka. Dostęp do sieci jest jednak niezbędny do wykonania operacji związanych z zamówieniem i płatnością.
Czy zatem progressive web applications mają jakieś wady?
Aplikacje PWA nie są jednak uniwersalnym rozwiązaniem, które sprawdzi się w każdych warunkach. Progressive web app nie sprawdzi się przy np. tworzeniu gier graficznych, gdzie istotne jest wykorzystanie w pełni mocy obliczeniowej urządzenia mobilnego.
Mimo że tworzenie natywnych aplikacji mobilnych jest bardziej czasochłonne (więc też droższe), zapewniają one skuteczniejsze wykorzystanie funkcji urządzenia, co przekłada się na lepszy UX. Natomiast brak konieczności umieszczenia aplikacji PWA w sklepach z aplikacjami odbiera dodatkową szansę na promocję wśród użytkowników szukających aplikacji po danych słowach kluczowych.
Czy w takim razie PWA zastąpią aplikacje natywne?
Najprawdopodobniej Progressive Web Apps nie zastąpią aplikacji natywnych. Jednak są świetną alternatywą cenową dla kosztownych aplikacji natywnych. To najszybszy i najtańszy sposób na ulepszenie aplikacji sklepowych w wersji mobile. Dlatego jeśli chcesz generować większe przychody i angażować więcej klientów przy rozsądnie niskich kosztach, progresywna aplikacja internetowa będzie idealnym rozwiązaniem . Z drugiej strony, jeśli chcesz, aby Twoja marka zyskała reputację, oferując doskonałe wrażenia użytkownikom, na dłuższą metę warto rozważyć tworzenie aplikacji natywnych.
Popularne aplikacje PWA
Technologia PWA pozwala na tworzenie aplikacji, z których użytkownicy często korzystają w czasie wolnym — są wśród nich więc serwisy społecznościowe, serwisy e-commerce, czy aplikacje rozrywkowe. Poniżej znajdziesz przykłady znanych aplikacji.
1. Spotify
Jedna z najpopularniejszych aplikacji do odtwarzania muzyki jest przykładem na to, jak aplikacje PWA pozwalają na stworzenie podobnego doświadczenia dla użytkowników korzystających z aplikacji za pomocą komputera i smartfona. Różnice są niemal niezauważalne, bowiem aplikacja na komputerze uruchamiana jest w podobny sposób jak na urządzeniach mobilnych.
2. Uber
Wraz z ekspansją na nowe rynki, firma postanowiła wykonać nową aplikację w standardzie PWA. Decyzja ta była poparta wynikami — od uruchomienia serwisu m.uber.com, 30% użytkowników zamawiało przejazdy za pomocą komputera, a nie urządzeń mobilnych. Lżejsza aplikacja progresywna (ważąca 50 kb) pozwala na rezerwację przejazdów w podobny sposób jak na smartfonie i umożliwia rezerwację samochodów z urządzeń podpiętych do sieci 2G o niskiej prędkości.
3. Pinterest
W przypadku Pinteresta głównym czynnikiem zmian była słaba wydajność na urządzeniach mobilnych — zaledwie 1% użytkowników mobilnych dokonywało rejestracji, logowało się lub instalowało aplikację. Przebudowa sieci mobilnej za pomocą technologii PWA przyniosła pozytywne zmiany, czego wynikiem było zwiększenie czasu spędzanego w aplikacji o 40%, zwiększenie przychodów z reklam generowanych przez użytkowników o 44% i zwiększenie podstawowego zaangażowania o 60%.
4. Starbucks
Głównym celem wykorzystania progressive web applications przez Starbucks było zapewnienie wszystkim klientom przyjaznego systemu zamówień online. Możliwość przeglądania menu i dodawania pozycji do koszyka w trybie offline pozwala na dotarcie do większej liczby klientów, szczególnie na rynkach wschodzących. PWA, działająca jak aplikacja natywna jest lżejsza o 99.84% od aplikacji Starbucksa na iOS, dzięki czemu udało się podwoić liczbę zamówień online.
5. 2048 Game
Gra logiczna, która podbiła serca internautów w 2014 roku, początkowo została wydana w formie aplikacji na Androida i iOS. Po szybkim sukcesie (4 miliony użytkowników w niecały tydzień), twórcy umożliwili użytkownikom szybki dostęp do gry pod adresem 2048game.com, dostarczając niemal identyczne doświadczenie jak w wersji natywnej. Dodatkowym atutem jest to, że aplikacja PWA pozwala na grę w trybie offline.
Jak tworzyć aplikacje progresywne?
Proces tworzenia aplikacji PWA jest mniej skomplikowany niż budowa aplikacji mobilnych. Upraszczając, aplikacją progresywną może być przekonwertowana strona internetowa, wzbogacona o funkcje natywne. Zespół tworzący taką aplikację nie różni się zbytnio od typowych projektów frontendowych.
Aplikacje PWA budowane są z użyciem JavaScript, CSS i HTML, a wśród najczęściej wybieranych narzędzi do tworzenia progressive web applications znajdują się Angular, React.js, Vue.js, Polymer, Webpack, Knockout czy PWA Builder. Wybór dostępnych narzędzi zależy od potrzeb i oczekiwań klienta, jednak główną rzeczą, jaką należy mieć na uwadze, jest ułatwienie użytkownikom korzystania ze strony.
Tym, co wyróżnia aplikacje progresywne od tradycyjnych stron internetowych, jest kompatybilność z większością przeglądarek, systemów i urządzeń, praca w trybie offline i wysyłanie powiadomień push. Wszystko to sprawia, że przypominają aplikacje natywne, jednak zwykle zajmują mniej pamięci niż aplikacje mobilne.
PWA czy aplikacje mobilne?
Progressive web applications zapewniają wygodny dostęp do serwisu internetowego z urządzeń mobilnych. Co więcej, progresywne aplikacje webowe są stosunkowo szybkie i tanie do wdrożenia, a firmy, które zdecydowały się na budowę aplikacji PWA odnotowały wzrost konwersji i wyższe zaangażowanie użytkowników. Jeśli więc nie potrzebujesz aplikacji mobilnej z rozbudowanymi funkcjonalnościami, PWA jest odpowiednim rozwiązaniem.
