Eine Progressive Web App (PWA) ist eine normale Webseite, die sich wie eine native App anfuehlt: Sie laesst sich installieren, funktioniert offline und kann Benachrichtigungen senden – ganz ohne App-Store und ohne separaten Code fuer jede Plattform.

Die Kernmerkmale einer PWA

  • Installierbar: Ueber das Web App Manifest (eine JSON-Datei mit Name, Icons und Start-URL) wird die Webseite zum App-Symbol auf dem Startbildschirm.
  • Offline-faehig: Ein Service Worker – ein JavaScript-Skript im Hintergrund – faengt Netzwerk-Anfragen ab und bedient sie aus dem Cache, wenn keine Verbindung besteht.
  • Sicher: PWAs erfordern HTTPS, damit Manipulation unterwegs ausgeschlossen ist.
  • Responsiv: Die Oberflaeche passt sich an Handy, Tablet und Desktop an.

Service Worker – das Herz der PWA

Der Service Worker laeuft unabhaengig von der geoeffneten Seite im Hintergrund. Er kann Ressourcen vorab speichern, veraltete Inhalte austauschen und Push-Nachrichten empfangen. Damit ist die App auch bei schlechter Verbindung sofort nutzbar – ein grosser Vorteil gegenueber klassischen Webseiten.

Vorteile gegenueber nativen Apps

Eine PWA braucht keinen App-Store, keine getrennten Versionen fuer iOS und Android und keine manuellen Updates – die Nutzer bekommen immer die aktuelle Version, sobald sie die Seite oeffnen. Bekannte Beispiele sind Twitter Lite, Pinterest und viele Shopping-Seiten. Besonders gut funktioniert das Zusammenspiel mit einer SPA-Architektur, weil dort ohnehin viel per JavaScript im Browser passiert.

Verwandte Grundlagen: Browser, HTTPS, HTML, CSS, CDN, URL.