PWA (Progressive Web Apps) - co to jest?

PWA  jest to aplikacja dostępna na urządzeniu mobilnym, ale też w przeglądarce laptopa / urządzenia dostępowego, zakodowana w technologii znanej ze stron www (HTML, JS, CSS). Patrząc z innej perspektywy PWA jest to strona mobilna, która zachowuje się i działa podobnie do standardowej aplikacji mobilnej zainstalowanej na smartfonie. W efekcie PWA łączy zalety stron www (responsywność, szybkość działania, łatwość tworzenia, niski koszt), z zaletami aplikacji mobilnych (łatwość instalacji, aktualność, dostęp offline, szybkość)
2020-10-02 13:00
2 minuty czytania

Atrybuty aplikacji PWA (PWA checklist)

Są one jednocześnie zaletami PWA.

  • Bezpieczeństwo. Wykorzystanie SSL a czyli bezpiecznego połączenia. Protokół TLS szyfruje dane monitoruje ich integralność. 
  • Responsywność - aplikacja podobnie jak skaner w dostosowuje się do szerokości ekranu dzięki temu wygląda dobrze zarówno na urządzeniach stacjonarnych laptopach jaki telefonach oraz tabletach o różnej rozdzielczości
  • Szybkość ładowania. Ewa ładują się szybko nawet na wolnych połączeniach internetowych.
  • Niezależność od połączenia internetowego. Aplikacja PWA działa zarówno z dostępu do internetu jakich trybie offline.
  • Aktualność. PWA nie trzeba aktualizować. Są one automatycznie aktualizowane dzięki Service Worker.
  • Możliwość wykorzystania powiadomienia push.
  • Działanie na wszystkich przeglądarkach
  • Osoby adres URL każdej podstrony aplikacji

 

Dodatkowe zalety PWA

  • Dostępność. aplikacja PWA to jeden kod źródłowy dla wszystkich systemów operacyjnych. Dzięki temu nie potrzeba już tworzyć i rozwijać osobnych aplikacji na Windowsa na Androida i iOS. w efekcie koszty stworzenia aplikacji PWA są wielokrotnie niższe od aplikacji dedykowanych 
  • Łatwość instalacji z poziomu strony www czyli dodania do pulpitu urządzenia mobilnego lub przeglądarki internetowej takiej jak Google Chrome.

Korzyści z zastosowania PWA

W efekcie wykorzystanie PWA:

  • Podnosi współczynnik konwersji
  • Zwiększa czas sesji czyli użytkownicy zostaję dłużej na naszej stronie
  • Zwiększa liczbę podstron odwiedzanych przez użytkownika w trakcie sesji.

 

Wady PWA

PWA jakkolwiek świetne nie jest jednak lekiem na całe zło, nie jest rozwiązaniem wszystkomajacym. 

Niektóre z wad PWA:

  • Aplikacje PWN mają ograniczone możliwości w stosunku do aplikacji natywnych. Nie mogą korzystać z bluetooth, czy NFC. Technologie te nie są jednak konieczne do stworzenia większości aplikacji e-commerce
  • Nie sprawdzają się w przypadku rozbudowanych aplikacji
  • PWA nie mają dostępu (nie mogą korzystać z) danych na telefonie użytkownika
  • Brak możliwości uruchomienia na starszych urządzeniach Apple poniżej iOS 11.3
  • mniejsza wydajność i gorsze optymalizacja od aplikacji napisanych w Swift lub kotlin

Aplikacja natywna - co to jest?

W tym kontekście trzeba sobie powiedzieć czym jest aplikacja natywna. 

Aplikacja natywna to aplikacja stworzona (zaprojektowana, zakodowana, opublikowana i rozwijana) na jedną platformę, czyli osobny kod / osobna aplikacja jest tworzona na iOS, a osobna na Android.

Zaletą aplikacji natywnych jest możliwość skorzystania przez nie z pełnych możliwości podzespołów telefonu oraz skorzystania z danych na telefonie. Oczywiście zgodnie z udzielonymi przez użytkownika aplikacji uprawnieniami i możliwościami danymi przez system. 

Jak zainstalować aplikację PWA?

Instalacja aplikacji PWA na urządzeniu mobilnym z systemem Android

Należy wejść na stronę. na dole strony wyświetla się komunikat o możliwości instalacji aplikacji. po kliknięciu w przycisk zainstaluj aplikację instaluje się nie jest dostępna z pulpitu naszego telefonu

Instalacja aplikacji PWA na urządzeniu mobilnym z systemem iOS (iPhone / iPad)

instalacja na systemie iOS wygląda podobnie po wejściu na stronie od strony należy nacisnąć przycisk więcej i z menu dodać do ekranu początkowego

Instalacja aplikacji PWA na laptopie / urządzeniu stacjonarnym z przeglądarką Google Chrome 

Instalacja w Google Chrome na urządzeniu desktopowym. 

Po wejściu na stronę internetową należy kliknąć w trzy kropeczki w prawym górnym rogu i znaleźć nową instalację aplikacji. Aplikacja zostanie zainstalowana i dodana do skrótów przeglądarce na ekranie głównym przeglądarki.

Przykładowa aplikacja PWA

Przykładową aplikacją PWA stworzoną przez Krakweb jest Ekodom - https://www.ekodom.edu.pl 


Blog Artykuły
Ustawienia dostępności
Wysokość linii
Odległość między literami
Wyłącz animacje
Przewodnik czytania
Czytnik
Wyłącz obrazki
Skup się na zawartości
Większy kursor
Skróty klawiszowe