PWA (Progressive Web App) to aplikacja webowa, która udaje natywną i robi to na tyle dobrze, że użytkownik często nie zauważa różnicy. Otwierasz ją w przeglądarce jak zwykłą stronę, ale możesz ją zainstalować na ekranie głównym telefonu albo w systemie, uruchamiać bez paska adresu, korzystać z niej offline i odbierać powiadomienia push. Słowo „progressive” oznacza, że aplikacja działa wszędzie, a na nowszych przeglądarkach po prostu dostaje więcej supermocy.
Jak to działa
Pod maską PWA stoją trzy filary. Pierwszy to service worker — skrypt JavaScript działający w tle, niezależnie od otwartej karty. Przechwytuje żądania sieciowe i potrafi serwować zasoby z cache, dzięki czemu aplikacja odpala się offline albo na słabym łączu. Drugi to manifest (manifest.json) — plik opisujący nazwę, ikony, kolory i tryb wyświetlania, który mówi systemowi „da się mnie zainstalować”. Trzeci wymóg to HTTPS, bo service worker bez bezpiecznego połączenia po prostu się nie zarejestruje (wyjątkiem jest localhost przy developmencie).
Po spełnieniu tych warunków przeglądarka pokazuje przycisk „Zainstaluj”, a aplikacja ląduje na pulpicie z własną ikoną. Do tego dochodzą API typu Push i Background Sync, które domykają wrażenie natywności.
Przykład z praktyki
Najprościej zacząć od gotowego frameworka. W projekcie React z Vite dorzucasz wtyczkę: npm install -D vite-plugin-pwa, dodajesz VitePWA() do vite.config.js i masz wygenerowany manifest oraz service worker bez ręcznego pisania logiki cache. W świecie Angulara robi to ng add @angular/pwa. Czy aplikacja faktycznie spełnia kryteria, sprawdzisz audytem Lighthouse w DevTools Chrome — pokaże, czego brakuje (np. brak ikony 512×512 albo niezarejestrowany service worker). Klasyki gatunku to Twitter Lite, Spotify Web czy Starbucks.
Częste błędy i mity
Mit numer jeden: „PWA to to samo co aplikacja w sklepie”. Nie — instaluje się ją z poziomu przeglądarki, choć przez Trusted Web Activity da się ją też wrzucić do Google Play. Pułapka techniczna: agresywne cache’owanie service workera potrafi serwować starą wersję aplikacji nawet po deployu — dlatego pilnuj wersjonowania cache i strategii aktualizacji. Pamiętaj też, że wsparcie bywa kapryśne: na iOS powiadomienia push w PWA pojawiły się dopiero w nowszych wersjach Safari i mają swoje ograniczenia, więc nie zakładaj, że wszystko działa identycznie jak na Androidzie.
Pojęcia powiązane
Warto kojarzyć: service worker, Web App Manifest, Cache API, Push API, Lighthouse, SPA (Single Page Application), oraz alternatywy hybrydowe jak React Native czy Flutter, gdy potrzebujesz pełnego dostępu do natywnych funkcji urządzenia.