Image

Progressive Web App: Welche Vorteile bieten sie?

Avatar
12. Juli 2021

Eine Progressive Web App ist eine neuartige Methode der App-Entwicklung. Sie ist als eine Weiterentwicklung einer Web App, also einer Webanwendung, die ohne Installation im Browser läuft, zu verstehen

Hauptsächlich ist Google für das neue App Format verantwortlich, wodurch PWAs besonders für Android Geräte ausgelegt sind. Auf Apple Geräten (iOS) gibt es gewisse Einschränkungen. Dazu mehr im Kapitel Stärken und Schwächen von PWAs.

In Kürze sollen Web Apps den Nutzern folgendes ermöglichen:

  • Inhalte auf allen möglichen Ausgabegeräten zur Verfügung zu stellen
  • Webinhalte auch bei schlechter oder nicht vorhandener Internetverbindung zu nutzen
  • Websites schnell zu laden
  • von einer sehr guten User Experience zu profitieren

Begriffsdefinition von PWA

Eine PWA ist wie eine gewöhnliche Website über eine URL im Internet zugänglich und wird Browser ausgeführt. Sie ist dadurch von allen Internetfähigen Geräten abrufbar und ist unabhängig von App Stores. Auf dem meisten Endgeräten (Computer, Android, iOS) lässt sich die PWA direkt über den Browser installieren.

Der User hat somit ein App Icon auf dem Homescreen und kann diese sofern die Daten im Browser-Cache gespeichert sind ohne Internetverbindung öffnen. Daten können im Hintergrund mit dem Webserver ausgetauscht werden, sobald eine Internetverbindung verfügbar ist. Die PWA muss ein responsives Design haben, damit sich die Anwendung an alle Displaygrössen anpassen kann und dem User der Eindruck einer nativen App vermittelt wird.

Technische Umsetzung von PWAs
Technische Umsetzung von PWAs

Technische Umsetzung

Die minimalen Voraussetzungen für eine funktionierende und somit installierbare Progressive Web App sind ein Web App Manifest, ein Service Worker sowie ein SSL Zertifikat (https-Verbindung).

Web App Manifest

Ein Web App Manifest ist eine Datei im JSON-Format, welches Informationen zur Website enthält. Unter anderem gehören dazu der Titel, die Beschreibung, verschiedene Homescreen-Icons und die Anzeigeeinstellungen für die App-Ansicht.

Service Worker

Der Service Worker ist ein Javascript Dokument, das sich selbständig im Browser installiert. Er speichert unter anderem die Ressourcen der PWA im Cache, damit der Zugriff schneller ist und führt im Hintergrund Aufgaben, wie den Austausch zwischen dem Server und dem Endgerät, aus.

Alle Netzwerkanfragen laufen durch den Service Worker und er entscheidet, ob er die Daten aus dem Cache zur Verfügung stellt oder aktualisierte Daten vom Server abruft. Auch wenn die Website bzw. PWA geschlossen wird, ist er aktiv und arbeitet im Hintergrund weiter.

Stärken und Schwächen von PWAs

Vorteile

  • Plattformübergreifende Lösungen sind im Vergleich zu nativen Apps weniger aufwendig und kostenintensiv in der Umsetzung.
  • Der Webauftritt und eine plattformunabhängige Applikation können gleichzeitig realisiert werden.
  • PWA können auf native Funktionen der Endgeräte zugreifen. (Push-Nachrichten, Standort, Kamera, Mikrofon und weitere Sensoren)
  • Kein Upload im Apple App-Store oder Android Play-Store nötig.
  • Kein Download von Updates nötig. Sobald eine Internetverbindung besteht, aktualisiert sich die PWA auf die neuste Version.
  • Trotz der ähnlich guten Performance im Vergleich zu nativen Apps, benötigen PWAs kaum Speicherplatz und weniger Ressourcen
  • PWAs können über Suchmaschinen gefunden und im Web verlinkt werden.
  • PWAs können von jedem Gerät mit Webbrowser verwendet werden, egal wie alt sie sind.

Nachteile

  • Push-Benachrichtigungen werden von iOS noch nicht unterstützt. Mögliche Workarounds sind Benachrichtigungen per E-Mail oder einem Messenger sowie die Integration der PWA in einem App Container, der dann im App Store angeboten wird.
  • Es kann nicht auf jede Gerätefunktion zugegriffen werden. Beispielsweise fehlt der Zugriff auf Kontakte, Kalender, Bluetooth und NFC. Auch wenn diese Funktionalitäten noch folgen sollten, wird sich eine PWA nie so stark in das Betriebssystem integrieren lassen, wie eine native App.
  • PWA können auf native Funktionen der Endgeräte zugreifen. (Push-Nachrichten, Standort, Kamera, Mikrofon und weitere Sensoren) Eine PWA kann nicht im Apple App-Store oder Android Play-Store publiziert werden.
Avatar von
Jeremy Knöpfel
None

Dank unserer erprobten Methoden und Prozesse können wir Lösungen entwickeln, die perfekt auf ihre Zielgruppen zugeschnitten sind. Sprechen Sie mit uns über die digitalen Potenziale für Ihr Unternehmen.

Jetzt kontaktieren decoration

Weitere Artikel aus der Kategorie Technologie

Image
16. Februar 2022

Software made in St.Gallen

Das Label «swiss made software» steht für Schweizer Werte in der Softwareentwicklung. Seit Februar ist Codely Träger des Labels.

Author
von Giacomo Bütler