Introduction to progressive web apps

Einleitung

Das Web schlägt zurück

  • Alle paar Jahre gibt es neue, zentrale Technologien, die das Web verändern können und populär werden.

    • Ajax bespielsweise wurde durch den XMLHttpRequest populär und veränderte im Zuge des Web 2.0 das Verhalten statischer Seiten.
    • Mobile First veränderte wie wir für das Web entwickelten.
  • Das Erlebnis bei der Nutzung einer Progressive Web App fühlt sich zu Beginn an, wie eine statische Website. Je mehr der Nutzer mit der Website interagiert, dest eher fühlt sich diese Website an wie eine native App, da während der Nutzung neue Features hinzugefügt werden können.

    • Nutzung ohne Internetverbindung
    • Push Notifications
    • Installation auf dem Homescreen
  • Es wird immer schwerer, sich in App-Stores gegen die Konkurrenz durchzusetzen. Mit einer Progressive Web App haben wir die Möglichkeit, den Nutzer abzuholen, der sich bereits auf unserer Seite befindet.

    • (Anm.: Dennoch muss die PWA aktiv vom Nutzer installiert werden. Angesichts der aktuellen Flut an Werbemitteln, Cookie-Bannern und Dialogen, bin ich skeptisch, ob Nutzer hierzu bereit sind.)
  • Mit einer progressive Web App müssen wir uns nicht dem Funnel aussetzen, der für die Installation einer nativen App durchlaufen werden muss:

    • Nativ: Website -> App Store -> App finden -> App installieren -> App nutzen -> Notwendige Berichtigungen erteilen
    • PWA: Website -> Installation

Vorteile einer progressive Web App

  • Keine Internetverbindung notwendig (durch Service Worker, die auf die Verbinding des Nutzers reagieren)
  • schnelle Ladezeiten (abermals durch Service Worker)
  • Push Notifications
  • Icons auf dem Homescreen
    • (Anm.: hierfür ist nicht notwendigerweise eine PWA notwendig)
  • Look einer nativen App. Splash-Screens, Full-Screen-Mode

Lyft hatte durch Entwicklung einer PWA weitere Vorteile

  • Native Apps für ältere Geräte müssen nicht mehr supported werden -> weniger Entwicklungskosten
  • Auch Geräte ohne App-Stores konnten nun unterstützt werden -> größere Reichweite

Service-Worker - das Herz der PWA

  • Service Worker sind Skripte, die Teile einer Website kontrollieren können.
  • Service Worker werden nach der Installation auf dem Gerät, außerhalb des Browsers ausgeführt.
  • Ein Service Worker kann Anfragen an die entsprechende Seite modifizieren und auf Events eingehen.
  • ´Service Worker**funktionieren auch ohne Internet-Verbindung oder den Browser.
  • Service Worker sind in JavaScript geschrieben und sind somit eine standartisierte Web-Technologie.

Am besten direkt bei Amazon bestellen*


Feedback auf Twitter