Progressive Web App (PWA)

Was ist eine Progressive Web Apps (PWA)?

Bei den Progressive Web Apps (PWA) handelt es sich um Websites, die im Unterschied zu konventionellen Webseiten besondere Eigenschaften von nativ ausgeführten Apps besitzen. Zu diesen Eigenschaften gehört beispielsweise die Möglichkeit, durch den Einsatz von HTML5 auch eine Offline-Speicherung von Daten zu erlauben. Dadurch wird keine ständige Internetverbindung benötigt. Im Gegensatz zu nativen Apps ist es nicht notwendig, eine Progressive Web App zu installieren. Außerdem lässt sich eine PWA über Suchmaschinen finden, was die Verbreitung im Vergleich zu nativen Apps vereinfacht.

Progressive Web Apps: Kombination aus nativer App und mobiler Website

Um eine Progressive Web App aufzurufen, wird die URL in die Adresszeile eines beliebigen Browsers eingegeben. Alternativ hierzu ist es auch möglich, einen Link auszuwählen, um sich die PWA anzeigen zu lassen. Durch die Nutzung des HTTPS-Protokolls wird die Kommunikation zwischen dem genutzten Endgerät, also dem Client, und dem Server insbesondere in Hinblick auf das Caching verbessert. Durch die lokale Speicherung spezifischer Daten können auch Offline-Funktionen zur Verfügung gestellt werden. Dadurch sollen die Vorteile von Websites, worunter die einfache Auffindbarkeit über eine Suchmaschine und die fehlende Notwendigkeit einer Software-Installation fallen, mit den Vorzügen von nativen Apps verbunden.

Letztere erfordern eine Installation, erlauben dafür aber ein Hinzufügen auf dem Homescreen und ermöglichen eine zumindest eingeschränkte Nutzung ohne ständige Internetverbindung. Weil nicht sämtliche Inhalte einer nativen App neu geladen werden müssen, reduziert sich der Datendurchsatz im Vergleich zu einer mobilen Website. Eine Progressive Web App kann von diesen Vorzügen ebenso Gebrauch machen. In gewisser Weise handelt es sich in Hinblick auf das Benutzererlebnis bei einer PWA um einen Kompromiss aus responsive Website und nativer App.

Schlüsselmerkmale der Progressive Web Apps

Google empfiehlt den Entwicklungsansatz des Progressive Enhancement. Dadurch sollen grundlegende Funktionen einer Website auch ohne Internetverbindung verfügbar sein. Zudem sollen die Benutzerbedürfnisse auch dann befriedigt werden, wenn Flash oder JavaScript durch das verwendete Endgerät nicht unterstützt werden. Dadurch werden bei einer Progressive Web App zentrale Eigenschaften herausgebildet die laut Google-Vorgaben folgendermaßen beschrieben werden können:

• Performance. Eine Progressive Web App soll unmittelbar auf die Eingaben des Nutzers reagieren können. Eine verminderte Reaktionsgeschwindigkeit soll insbesondere beim Scorelingen in jedem Fall verhindert werden. Gegebenenfalls können unvermeidbare Ladezeiten durch Animationen überdeckt werden.
• Zuverlässigkeit. Eine PWA sollte die Inhalte selbst dann laden können, wenn eine zuverlässige und schnelle Internetverbindung nicht verfügbar ist. Dadurch wird insbesondere den Herausforderungen bei der mobilen Nutzung Rechnung getragen, weil eine vollständige Netzabdeckung insbesondere im schnellen 4G-Netz noch nicht überall verfügbar ist.
• Benutzererlebnis. Obwohl keine Installation auf dem eigenen Endgerät vorgenommen werden musste, soll sich die Benutzung hinsichtlich der Funktionsvielfalt und der Reaktionsgeschwindigkeit auf Eingaben genauso anfühlen, als handle es sich um eine konventionelle, native App.

Um das Konzept der Progressive Web App erfolgreich in die Praxis umzusetzen, werden sogenannte “Service Worker” benötigt. Letztere agieren im Hintergrund und laden bestimmte Inhalte bei einer noch bestehenden Internetverbindung in den Cache. Dadurch können diese Inhalte abgerufen werden, ohne dass eine erneute Kommunikation mit dem HTTP-Server erfolgen muss. Ein Script auf dem Client agiert dabei wie ein Proxy-Server. Sobald bestimmte Inhalte angefordert werden, werden diese ganz einfach aus dem Cache abgerufen. Dafür ist es notwendig, dass diese Inhalte im Vorfeld durch die Entwickler definiert wurden. Hierfür kommen Methoden wie Prerendering und Preloading zum Einsatz.

Vorteile der PWA

Im Zuge der Entwicklung einer PWA ist es deshalb notwendig, bestimmte Schlüsselressourcen zu identifizieren und durch ein entsprechendes Script vorzuladen. In Abhängigkeit bestimmter Nutzerinteraktionen kann die PWA bereits im Vorfeld die richtigen Inhalte puffern. Bei dem konkreten Abruf durch den Nutzer ist dann keine Internetverbindung mehr notwendig, was die Abhängigkeit insbesondere von mobilen Datenverbindungen reduziert. Dadurch wird aber nicht nur der Datendurchsatz verringert, auch die Performance erhöht sich insbesondere im Vergleich zu konventionellen Websites. Die Nutzererfahrung bleibt dadurch auch bei schwankender oder geringer Internetgeschwindigkeit konsistent. Zudem kann eine Progressive Web App auch bei einem Endgerät mit einer geringen Rechenleistung mit hoher Performance ausgeführt werden.

Keine Einschränkungen hinsichtlich des Betriebssystems

Insbesondere in Hinblick auf die Suchmaschinenoptimierung bieten die Progressive Web Apps erhebliche Vorteile, weil es für den Nutzer problemlos möglich ist, die Inhalte über eine Suchmaschine aufzurufen. Sehr häufig wird keine Installation einer App vorgenommen, die Hemmnisse zur Verwendung einer PWA fallen allerdings deutlich geringer aus. Auch hinsichtlich des verwendeten Betriebssystems gibt es keine Einschränkungen bei der PWA, weil der Browser selbstverständlich unabhängig vom verwendeten System genutzt werden kann.