zurück zum Artikel

Progressive Web Apps, Teil 5: Das App-Modell der Zukunft?

ÜberKreuz

In den vergangenen Teilen dieser Serie haben wir uns mit den wichtigsten Features der Progressive Web Apps beschäftigt. Stellen sie das App-Modell der Zukunft dar? Die Antwort hängt am Engagement eines Plattformanbieters. Doch es gibt auch Übergangslösungen.

Geht es nach Google, sind App-Stores bald ein Konstrukt der Vergangenheit. Die Idee hinter Progressive Web Apps ist es, dass Web-App und App-App exakt deckungsgleich sind. Dank moderner Webtechniken um HTML5 – etwa zur Umsetzung von 2-D- oder 3-D-Visualisierungen[1], Sprachein- und -ausgabe[2], Gamepadeingabe[3] und vielen weiteren – können es Web-Apps schon heute mit nativen Anwendungen aufnehmen. Der Service Worker[4] bringt zusätzlich Offlinefähigkeit und Push-Benachrichtigungen sowie Methoden zur Datensynchronisierung oder für Geofencing in das Web und verleiht dem App-Modell zusätzlichen Nachdruck. Zudem sind die Anwendungen plattformübergreifend ausführbar, idealerweise sogar ohne Änderung auch nur einer einzigen Zeile Code. Progressive Web Apps werden gerne auch anhand von acht Eigenschaften[5] beschrieben. Sie sind:

  1. Discoverable: Dank des Web App Manifest können sie von ganz normalen Websites unterschieden werden. Suchmaschinenanbieter können etwa spezielle Suchen nach Webanwendungen einrichten (siehe Teil 3[6]).
  2. Installable: Mit einem Tippen des Fingers werden die im Webbrowser ausgeführten "Web-Apps" zur auf dem Gerät installierten "App-App" – inklusive Symbol auf dem Startbildschirm und Auftritt im App-Switcher (siehe Teil 3[7]).
  3. Linkable, inhärente Eigenschaft des Web: Auf Anwendungen und Zustände oder Sichten innerhalb von Anwendungen kann mithilfe eines Uniform Resource Locators (URL) verwiesen werden.
  4. Network independent: PWA funktionieren auch bei schwacher oder gar nicht vorhandener Verbindung (siehe Teil 2[8]).
  5. Progressive (siehe Teil 1[9]): Sie verhalten sich abwärtskompatibel und bieten so jedem Anwender die bestmögliche Erfahrung, abhängig vom verwendeten Browser und der Plattform.
  6. Re-engagable: Progressive Web Apps können Anwender dank Push-Benachrichtigungen über bestimmte Ereignisse informieren und sie somit zur Wiederverwendung der Anwendung bewegen (siehe Teil 2[10]).
  7. Responsive: Sie passen sich den Bildschirmabmessungen des jeweiligen Gerätes an – vom Smartphone bis zum 85-Zoll-Fernseher.
  8. Safe: da sie sich ausschließlich über das Hypertext Transfer Protocol Secure (HTTPS) und somit eine gesicherte Verbindung nutzen lassen (siehe Teil 4[11]).

Progressive Web Apps müssen nicht alle dieser Eigenschaften umsetzen. Als Mindestumfang einer Progressive Web App[12] wird häufig das Vorhandensein eines Web App Manifests und der Offlinefähigkeit und somit auch das Laden via HTTPS angesehen.

Neben Google sind auch Mozilla und Microsoft an Bord. In Googles Webstrategie passt die PWA-Story natürlich hervorragend. Einige bereits veröffentlichte PWAs (so etwa der Mobil-Client von Twitter[13]) adaptieren die Philosophie des Material Design, sodass sich diese Anwendungen nicht einmal optisch von ihren nativen Gegenstücken unterscheiden. Auch Firefox unterstützt Progressive Web Apps sowohl auf dem Desktop als auch auf Mobilgeräten. Für Microsoft, das auf seiner Hauskonferenz Build 2017 die Unterstützung der PWA-Techniken angekündigt hatte, könnten Progressive Web Apps letztlich sogar die Rettung des Windows Store bedeuten: Denn der Bing-Bot durchsucht das Web und übernimmt häufig genutzte PWAs[14] komplett automatisch in den App-Marktplatz von Microsoft.

Nur ein Plattformanbieter fehlt: Apple, der einst als Vorreiter des mobilen Web galt. Für einige Teilaspekte der Progressive Web Apps stellt Apple zwar proprietäre (Apple Pay JS[15]) oder veraltete (Application Cache[16]) Schnittstellen zur Verfügung. Doch die Service Worker lassen sich derzeit überhaupt nicht nutzen. Das gilt zugleich auch für alle Ausgaben von "Fremdbrowsern" unter iOS, denn auch unter der Haube des Chrome oder Firefox für iOS tickt letztlich ein abgespeckter Safari. Die Geräteverteilung spricht seit längerer Zeit eher für Google mit seinem Android-Betriebssystem. Rund 80 Prozent der derzeit verkauften Neugeräte werden mit Android betrieben, demgegenüber stehen rund 17 Prozent iPhones (Statista, April 2017[17]).

Allerdings sind es vor allem die iOS-Nutzer, die bereit sind, für Apps und In-App-Käufe zu zahlen. Davon profitieren Entwickler. Apple wiederum profitiert von den üppiges 30 Prozent Umsatzprovision, die über den App Store als zentrale Vertriebsplattform generiert werden. Das dürfte auch weiterhin zu lukrativ sein, um ihn aufzugeben. Zudem entfällt auch die Qualitätsprüfung und Kontrolle über den App-Marktplatz. Daher verwundert es wenig, dass Apple bisher kein klares Bekenntnis zugunsten der Progressive Web Apps abgegeben hat. Doch es gibt Übergangslösungen.

Eine mit Cordova und Electron umgesetzte Cross-Platform-Lösung
Eine mit Cordova und Electron umgesetzte Cross-Platform-Lösung

Die PWA-Features lassen sich dank Projekten wie Apache Cordova[18] oder GitHub Electron[19] schon zum jetzigen Zeitpunkt umsetzen. Apache Cordova stellt einen Wrapper dar, der Webanwendungen den Zugriff auf native Plattformfeatures erlaubt. Mit Cordova entwickelte Hybridanwendungen werden über die üblichen Vertriebswege verteilt. GitHub Electron kombiniert Google Chrome und Node.js, um dem Entwickler ebenfalls Zugriff auf native Plattformfeatures zur Verfügung zu stellen. Über diese Technologien ist es schon heute möglich, Offlinefähigkeit oder Push-Benachrichtigungen mit Webanwendungen zu kombinieren. Der Vorteil dieses Ansatzes: Sobald PWAs eines Tages auch unter iOS funktionieren, kann mit verhältnismäßig einfachen Mitteln auf derartige Anwendungen umgestellt werden. Diese "Hybrid-Lösung" kann man auch heute schon implementieren oder zumindest berücksichtigen. Natürlich ist der potenzielle Nutzerkreis für PWA schon heute sehr groß und wird durch die Verfügbarkeit in Microsoft Edge noch einmal zunehmen, sodass sich eine Investition in PWA durchaus lohnen kann.

Das Konzept der Progressive Web Apps klingt sehr vielversprechend: Ihren nativen Gegenstücken stehen sie in fast nichts nach und die Unterstützung für sie wächst weiterhin. Wenn es auch noch auf Apples Plattform zur Verfügung steht, handelt es sich bei PWA tatsächlich um das plattformübergreifende App-Modell der Zukunft. Bis zur dahin gibt es eine Vielzahl an Übergangslösungen. Und wie immer im Web, spielt die Zeit für uns: Durch immer neue Schnittstellen, wie etwa die Web Bluetooth API[20].

[Update, 04.08.2017: Am 3. August 2017 wurde bekannt, dass Apple mit der Implementierung des Service Worker begonnen hat. Eine Einordnung finden Sie in Teil 6 dieser Serie.[21]]


URL dieses Artikels:
http://www.heise.de/-3767383

Links in diesem Artikel:
[1] https://speakerdeck.com/chliebel/grenzenlose-grafik-2d-3d-und-gamepad-fur-alle-plattformen-und-devices
[2] https://developer.mozilla.org/en-US/docs/Web/API/Web_Speech_API
[3] https://developer.mozilla.org/en-US/docs/Web/API/Gamepad_API/Using_the_Gamepad_API
[4] https://www.heise.de/developer/artikel/Progressive-Web-Apps-Teil-2-Die-Macht-des-Service-Worker-3740464.html
[5] https://developer.mozilla.org/en/Apps/Progressive
[6] https://www.heise.de/developer/artikel/Progressive-Web-Apps-Teil-3-Wie-die-Web-App-zur-App-App-wird-3464603.html
[7] https://www.heise.de/developer/artikel/Progressive-Web-Apps-Teil-3-Wie-die-Web-App-zur-App-App-wird-3464603.html
[8] https://www.heise.de/developer/artikel/Progressive-Web-Apps-Teil-2-Die-Macht-des-Service-Worker-3740464.html
[9] https://www.heise.de/developer/artikel/Progressive-Web-Apps-Teil-1-Das-Web-wird-nativ-er-3733624.html
[10] https://www.heise.de/developer/artikel/Progressive-Web-Apps-Teil-2-Die-Macht-des-Service-Worker-3740464.html
[11] https://www.heise.de/developer/artikel/Progressive-Web-Apps-Teil-4-Eine-Frage-des-Geldes-3759686.html
[12] https://infrequently.org/2016/09/what-exactly-makes-something-a-progressive-web-app/
[13] https://mobile.twitter.com
[14] https://developer.microsoft.com/en-us/windows/projects/events/build/2017/progressive-web-apps-and-the-windows-ecosystem
[15] https://developer.apple.com/documentation/applepayjs
[16] https://developer.mozilla.org/en/docs/Web/HTML/Using_the_application_cache
[17] https://de.statista.com/statistik/daten/studie/225381/umfrage/marktanteile-der-betriebssysteme-am-smartphone-absatz-in-deutschland-zeitreihe/
[18] https://cordova.apache.org/
[19] https://electron.atom.io/
[20] https://webbluetoothcg.github.io/web-bluetooth/
[21] https://www.heise.de/developer/artikel/Progressive-Web-Apps-Teil-6-Apple-am-Start-3793074.html