Progressive Web Apps – der Fortschritt bei Mobilapps

Die Vorteile von Web-Apps

Wie der Name schon sagt, sind Progressive Web Apps ebenfalls Browser-Apps und weisen deren Vorteile auf: Sie funktionieren geräte- und betriebssystemunabhängig und für ihre Nutzung ist keine Installation notwendig. Damit erhöhen Sie als Anbieter wesentlich die Reichweite Ihrer App, denn einer Umfrage von Google von 2019 zufolge bevorzugen 50 Prozent der Smartphone-Nutzer beim Surfen oder Einkaufen die Mobilversionen von Websites, statt dafür extra eine spezielle App herunterladen zu müssen.

Gleichzeitig machen Sie sich selbst das Leben einfacher. Zum einen verursachen Web-Apps weniger Entwicklungs- und Wartungsaufwand. Zum anderen, und das ist für viele das entscheidende Kriterium, machen Sie sich damit von App Stores unabhängig. Sie müssen bei der Veröffentlichung Ihrer App nicht mehr auf die Zulassung durch Apple, Google und Co. warten, sparen Provisionen (zum Beispiel für In-App-Verkäufe) und können auch Updates leichter und sicherer auf dem eigenen Server realisieren. Aus Marketingsicht wiederum ist es ein großer Vorteil, dass die Inhalte von Web-Apps von Suchmaschinen indexiert sowie leicht verlinkt und geteilt werden können.

Wenn dieser Artikel vor einigen Jahren erschienen wäre, würde jetzt die Einschränkung folgen, dass Sie diese Vorteile von Web-Apps gegenüber nativen Apps mit einigen gravierenden Nachteilen erkaufen müssten. Die wichtigsten: Wie andere Webseiten auch setzen Web-Apps in der Regel eine bestehende Internetverbindung voraus. Zudem ist es ohne Integration ins System Ihrer Anwender schwerer, Kundenbindung aufzubauen, zumal Ihre App dann nur im Browser und in unmittelbarer Konkurrenz zu so vielen anderen tollen Inhalten des WWW genutzt werden kann. Zudem bieten klassische Web-Apps nur eingeschränkte Funktionalität und können beispielsweise nicht auf das Dateisystem des Gerätes zugreifen. Die gute Nachricht: Web-Apps machen Fortschritte.

Domain - schon ab 0,08 € /Monat

Große Auswahl an günstigen Domain-Endunge

Jetzt Domain-Check starten

Progressive Web Apps

2015 prägte Google-Entwickler Alex Russell zusammen mit Designerin Frances Berriman den Begriff „Progressive (Web) Apps“. Gemeint waren „fortschrittliche“ Anwendungen, welche bestimmten Prinzipien folgten und dafür die damals neuesten Browser-Technologien nutzten (neben HTML5, CSS3 und JavaScript insbesondere Service Worker und Web App Manifest). Russell nannte insbesondere die folgenden Prinzipien:

• Responsiv
• Offline funktionsfähig
• App-ähnliche Bedienung
• Immer auf dem neuesten Stand („fresh“)
• Sicher (mit TLS – also über HTTPS – ausgeliefert)
• Auffindbar (Suchmaschinen können PWAs als „Anwendung“ erkennen und durchsuchen)
• Nutzt Re-Engagement-Funktionen des Betriebssystems (insbesondere Push-Benachrichtigungen)
• Installierbar (Icons auf dem Startbildschirm, laufen dann in eigenständigem Fenster, können als Standard-Anwendung registriert werden etc.)
• Verlinkbar (kann per Hyperlink erreicht und geteilt werden).

Die Entwicklung von PWAs wird wesentlich von Google vorangetrieben. Das Unternehmen stellt nicht nur umfangreiche Informationen für Entwickler zur Verfügung und baut die PWA-Unterstützung in Chromium und Android kontinuierlich aus. Google hat 2020 auch seine browserspezifischen Chrome-Apps abgekündigt und in Chrome OS (Chromebooks) stillschweigend begonnen, native Android-Apps durch PWAs zu ersetzen.

Und warum ist das „progressiv“?

Wie erwähnt, nutzen Progressive Web Apps fortgeschrittene Browser-Technologien, um app-ähnliches Verhalten, Offlinefähigkeit und Integration in die Betriebssystem-Umgebung zu realisieren, ohne dabei zu viele Tugenden von Webanwendungen zu opfern. Darüber hinaus bezieht sich „progressiv“ noch auf einen zweiten Aspekt, „progressive Verbesserung“ (Progressive Enhancement) genannt. Diese bezeichnet die Strategie, Webseiten bzw. -anwendungen so zu gestalten, dass ihre grundlegenden Inhalte und Funktionen allen Nutzern zugänglich sind, das heißt so weit wie möglich unabhängig von ihrer Browserausstattung und Internetbandbreite. Erweiterte Darstellungsfunktionen, für die mehr Bandbreite oder modernere Browser nötig sind, sind optional verfügbar, aber nicht Voraussetzung für die Nutzung.

Auch PWAs sind im Kern normale Websites, die als solche verwendet werden können – alle bekannten Browser mit nennenswerter Verbreitung unterstützen heute HTML5, CSS3, JavaScript und auch TLS. Die Nutzer entscheiden selbst, ob sie eine PWA auf ihrem Gerät installieren.

Was passiert dabei technisch?

Eine Progressive Web App ist im Wesentlichen eine responsive Website, die in eine app-artige Schale verpackt wird. Wesentliche Elemente für die App-Erfahrung sind „Service Worker“, „Web App Manifest“ und moderne Browser-APIs.

Ein „Service Worker“ ist Voraussetzung für die Offline-Fähigkeit von PWAs. „Worker“ sind Objekte, die JavaScript-Dateien einer Webseite im Hintergrund und unabhängig vom Hauptthread auszuführen (ursprünglich, damit rechenintensive Skripte nicht die Interaktion mit der Seite blockieren). Anders als gewöhnliche Web Worker werden Service Worker lokal installiert, können von verschiedenen Webseiten genutzt werden und fungieren als Proxy zwischen Browser und Server. Sie können eine geladene Seite steuern, aber auch unabhängig vom Hauptdokument arbeiten. Serverseitig können sie unter anderem die Verfügbarkeit des Servers prüfen, Inhalte lokal speichern (zum Beispiel per IndexedDB API), Daten im Hintergrund synchronisieren und auch Push-Benachrichtigungen oder Updates empfangen, selbst wenn das Dokument nicht geladen ist. Aus Sicherheitsgründen arbeiten Service Worker nur über HTTPS.

Ein Web App Manifest wird von Browsern genutzt, um eine PWA zu installieren, also zum Startbildschirm hinzuzufügen. Es handelt sich um eine vom W3C spezifizierte JSON-Datei mit Informationen über eine PWA und ihr Verhalten bei der Installation. Es enthält typischerweise Name und Beschreibung der Anwendung, die Icons zur Verwendung auf Homescreen, im Task-Manager etc., und natürlich die URL für den App-Start. Auch weitere Informationen etwa zu Bildschirmausrichtung, Darstellung (z. B. Vollbild) oder Geltungsbereich sind möglich.

Dass PWAs heute wesentlich mehr Geräte-Funktionen nutzen können als frühere Web-Apps (seit neuestem sogar Dateisystemzugriffe), verdanken sie dem Fortschritt bei Browser-APIs. Mehr zum Thema Browser-APIs finden Sie in diesem Blogartikel von DomainFactory.

Ein vorläufiges Fazit

Langfristig betrachtet, kann man eine interessante Entwicklung feststellen. Während auf dem Desktop immer mehr Anwendungen in den Browser wandern, gab es im Mobilbereich einen gegenläufigen Trend: Immer mehr Unternehmen versuchten zusätzlich zu ihrer Website noch plattformspezifische mobile Apps unter die Leute zu bringen, weil das mehr Funktionen ermöglichte und eine bessere Kundenbindung versprach. Jetzt sollen PWAs beide Welten zusammenwachsen lassen, und das, wenn es nach Google geht, mithilfe offener Web-Standards. Noch sind aber PWAs nicht wirklich durchgestartet. Der Fortschritt geht manchmal unerwartete Wege – es bleibt also spannend.

Titelmotiv: Bild von Edar auf Pixabay