31. Jan

Progressive Webapps kurz erklärt

Progressive Webapps sind in aller Munde und können die Zukunft der mobilen App-Entwicklung darstellen. Einzig Apple wehrt sich noch etwas gegen die browserbasierten Apps. Dennoch ist die Unterstützung zumindest so verbreitet, dass für etliche Anforderungen auf echte „native“ Apps verzichtet und auf die deutlich niederaufwendigeren Progressive Webapps gesetzt werden kann. Grund genug, um den Begriff und die Technologien kurz zu erklären.

Unterschied echte App zu Progressive Webapp (PWA)

Vorab der wohl wichtigste Unterschied. Echte Apps werden über den Apple App Store oder Google Play Market Store veröffentlicht und müssen von dort vom Benutzer heruntergeladen werden. Im Anschlus steht die App über ein Icon auf dem Homescreen zur Verfügung und kann von dort gestartet werden. Echte Apps sind in der Regel auf die Plattformen iOS und Android begrenzt. Je mehr Plattformen darüber hinaus bedient werden sollen, umso komplexer und kostenintensiver ist die Entwicklung.

Progressive Webapps lassen sich letztendlich gleich bedienen wie echte Apps, laufen aber im Browser. Progressive Webapps müssen also nicht erst aus den App Stores geladen werden, es reicht ein Aufruf der Website der PWA, z.B. pwa.meine-domain.de. Technisch gesehen handelt es sich im Grunde um eine normale Webseite, die allerdings besondere Eigenschaften aufweisen muss.

Die besonderen Eigenschaften von Progressive Webapps

Google, einer der Hauptinitiatoren von Progressive Webapps (kurz PWA), definiert 3 Charakteristika – die wir in deutsche Begrifflichkeiten umgeschrieben haben

Reliable – Zuverlässig (Offline)

Von einer klassischen Webseite kennt man das Problem. Sie wird im Internetbrowser aufgerufen – doch sobald die Internetverbindung abbricht oder in die Knie geht (unsere schöne mobile Netzabdeckung in Deutschland), ist Schluss mit der schönen neuen Welt. Entweder erscheint gleich eine Fehlermeldung – oder macht minutenlanges Warten nach einem Klick die Nutzererfahrunng zunichte.

Progessive Webapps werden ebenso über den Internetbrowser aufgerufen, funktionieren aber zuverlässig auch ohne Internetverbindung. Dafür bedienen sich PWAs bestimmten Caching-Techniken im Hintergrund, die benötigte Bilder, Dateien und Skripte automatisch lokal abspeichert. Damit kann eine PWA auch offline zuverflässig benutzt werden. Ausnahmen sind natürlich Zugriff auf Echtzeit- oder Online-Daten wie zum Beispiel aktuelle News. In diesem Fall wird der Benutzer dann aber ohne lange Wartezeit über einen entsprechenden Hinweis informiert. Bereits angesehene News können durch die Offline-Speicherfähigkeit natürlich weiterhin in der PWA geöffnet werden.

War die Offline-Fähigkeit früher über den lokalen Cache auf wenige MByte begrenzt, so steht heute Datenmengen (Texte und Medien) auch von mehreren hundert MByte nichts mehr im Wege.

Fast – Schnell und Reaktiosfreudig

Progressive Webapps müssen schnell sein. Der Benutzer muss direkt nach dem Aufruf erste Ergebnisse sehen und ohne lange Wartezeiten die PWA verwenden können. Darüber hinaus müssen Reaktionszeiten auf Eingaben oder Klicks so kurz wie möglich sein. Der mobile Benutzer ist von nativen Apps eine hohe User Expierence (UX) gewohnt, genau dieser Usability sind Progressive Webapps verpflichtet. Diese Schnelligkeit und Reaktionsfreudigkeit wird durch Caching-Mechanismen und verschiedenen UX-Paradigmen erreicht.

Engaging – Installierbar und Erreichbar

Der Aufruf der Progressive Webapp erfolgt in der Regel nur beim ersten Mal über den Browser. Nach der ersten Eingabe der Internetadresse im Browser erhält der Benutzer eine Nachricht/Popup, um die Progressive Webapp auf dem Homescreen (oder auch auf dem Desktop des PCs/Macs) zu installieren. Im Anschluss kann die PWA wie jede andere „echte“ App über das Icon auf dem Homescreen im Vollbildmodus geöffnet werden. Um die Benutzer auch nach dem ersten Aufruf weiter zu erreichen, unterstützen Progressive Webapps Push-Notifications. Das sind kurze Meldungen (zum Beispiel über eine neue News), die den Benutzer auch dann erreichen (z.B. auf dem Sperrbildschirm), wenn die App gar nicht geöffnet ist.

Vorteile einer Progressive Webapp

    • Einfache Verbreitung: Für echte Apps müssen Zugänge für die App-Stores eingerichtet werden, was vor allem bei Apple  nicht unbedingt das trivialste Unterfangen ist. Das Veröffentlichen von Apps im App Store (iOS) und bei Google Play (Android) ist zudem sehr aufwendig und damit auch kostenintensiv. Und nach der Einrichung bei Apple (inzwischen teilweise auch bei Goolge) wartet man mehrere Tage, bis die App endgültig freigeschalten und veröffentlicht ist. Die Veröffentlichung einer Progressive Webapp unterscheidet sich nicht vom Hochladen einer Website. Es wird ein einfacher Webhosting-Account benötigt, PWA hochladen – fertig
    • Einfache Update-Fähigkeit: Um eine Progressive Webapp zu aktualisieren, müssen einfach die entsprechenden Dateien auf dem Webserver/Hosting-Paket ausgetauscht/hochgeladen. Danach steht die Änderung sofort allen Benutzern zur Verfügung. Bei echten Apps muss der Code kompiliert, gepackt und in den Stores hochgeladen werden. Um im Anschluss wieder den gleichen, zeitaufwendigen Prüfungsprozess bei Apple zu durchlaufen. Eine Wartezeit von mehreren Tagen ist auch bei Updates nicht unüblich.
    • Plattformunabhängigkeit: Progressive Webapps laufen letztendlich auf jedem, einigermaßen aktuellen Browser. Damit sind PWAs eigentlich auf fast jedem Endgerät nutzbar. Zwar gibt es bei einigen Systemen, wie iOS oder einigen älteren Browsern, bestimmte Einschränkungen – die Grundfunktionalität ist aber überall benutzbar.
    • Geringere Einstiegshürde: Sie können von Ihrer Website direkt auf eine Progressive Webapp verlinken. Mit einem Klick darauf befindet sich der Benutzer in der App und kann diese sofort nutzen. Bei echten Apps muss zuerst einer der App Stores geöffnet und die App manuell installiert werden. Die Absprungrate dürfte dabei deutlich höher, als bei einer Progressive Webapp sein.
    • Geringere Kosten: Aufgrund der oben genannten vereinfachten Veröffentlichung, ist eine Progressive Webapp auch in der Wartung deutlich kostengünstiger. Zudem fallen die Gebühren für Apple und Google zum Betrieb der App Store Accounts weg. Ganz zu schweigen von den Entwicklungskosten einer browserbasierten App mit Webtechnologien, die im Gegensatz zu nativen Entwicklungen für iOS und Android teilweise nur einen Bruchteil betragen können.

Sie sehen, Progressive Webapps haben heutzutage für etliche Einsatzzwecke viele Vorteile. Und Dank des Ionic Frameworks, kann eine Progressive Webapp übrigens jederzeit problemlos in eine echte, in den App Stores veröffentlichbare App umgewandelt werden.

Einschränkungen

Doch wie so oft, gibt es leider auch ein paar Einschränkungen. Insbesondere das Thema Push-Notifications wird leider noch nicht durchgängig unterstützt. Das liegt vor allem an der abwehrenden Haltung von Apple, die durch die browserbasierten Apps natürlich ihr finanziell ertragreiches App-Store-Ökosystem in Gefahr sehen.  Push-Nachrichten werden unter iOS als auch auf Mac-Rechnern (Safari-Browser) daher leider noch nicht unterstützt. Unter Android dürften Push-Nachrichten dagegen fast durchgängig funktionieren, ebenso auf den Desktop-Browsern von Firefox und Chrome. Und selbst Microsoft hat sich mit dem aktuellen Edge-Browser geöffnet und bietet volle Unterstützung von Progressive Webapps an.

Sollten Sie also durchgängig, zwingend auch unter iOS auf Push-Notifications angewiesen sein, werden Sie um eine echte App nicht herumkommen. Für alle andere Szenarien kann eine Progressive Webapp eine sinnvolle, kostengünstige und zukunftsorientierte Alternative sein. Und mit dem von uns eingesetzten Ionic Framework ist eine Entscheidung pro PWA keine Einbahnstraße, denn wir können Ihnen ohne große Mehraufwand daraus eine echte App erstellen.

Um unsere Webseite für Sie optimal zu gestalten und fortlaufend verbessern zu können, verwenden wir Cookies. Durch die weitere Nutzung der Webseite stimmen Sie der Verwendung von Cookies zu.