Mit PWAs in die Zukunft?
24. Feb. 2022
Progressive Web-Apps (PWA) – ein neuartiges App-Format, das sich noch in der Entwicklung befindet und versucht, den Weg in die digitale Welt zu finden. Eine Progressive Web-Applikation zeichnet sich dadurch aus, dass sie Eigenschaften von Webseiten mit Merkmalen von nativen Applikationen verknüpft und dadurch sowohl im Web als auch auf mobilen Endgeräten genutzt werden kann.
Doch warum Progressive Web-Apps, wenn es bereits klassische App-Varianten gibt, wie beispielsweise native Apps oder hybride Apps? Was genau ist so „Progressive“ an einer PWA und worin liegen die Vor- sowie Nachteile zu klassischen Web-Applikationen?
Wir geben einen Überblick und zeigen Ihnen all dies an einem unserer aktuellen Projekte, einer Progressive Web-App als Kassenbuch, das als Feature bei den Warenwirtschafts- sowie ERP-Systemen des Anbieters APRO.CON Software GmbH & Co. KG eingesetzt wird.
APRO.CON – Warenwirtschaft mit System
Als ganzheitliches sowie modulares Warenwirtschaftssystem ist die Funktionsweise von APRO.CON im Detail auf die Anforderungen mittelständischer Lebensmittelbetriebe wie zum Beispiel Fleischereien, Käsereien, Hofläden, Confiserien, Bäckereien und Obst- sowie Gemüsehändler zugeschnitten.
Durch flexible Auswertungs- und Steuerungswerkzeuge können Betriebsabläufe transparent sowie sicher gestaltet werden – und mit dem von uns entwickelten mobilen Kassenbuch nun noch viel mehr.
Ein digitales Kassenbuch als Progressive Web-App
Die neue Software-Lösung für APRO.CON wurde als Progressive Web-Applikation entwickelt und soll allen Kunden fortan kurzfristig einen Echtzeit-Überblick über betriebsrelevante Kennzahlen ermöglichen. Das digitale Kassenbuch dient als zusätzliche und einfach zugreifbare Oberfläche an das Warenwirtschaftssystem, das in der Regel auf einem lokalen Server läuft.
Über die Web- oder aber App-Oberfläche können Ein- und Ausgaben mit nur einem Klick eingebucht werden – selbst das Fotografieren und der Upload von Belegen ist möglich.
Zudem kann ein vollautomatisierter Kassensturz oder Tagesabschluss durchgeführt werden, mit der weiterführenden Möglichkeit, sich die generierten Berichte im Nachgang anschauen zu können.
"Die Geräte übertragen beim Tagesabschluss sämtliche Daten automatisiert an die App. Der zuständige Mitarbeiter muss also nicht alles händisch in sein Smartphone oder Tablet tippen, sondern überprüft lediglich die automatisch erstellten Listen. Es gibt nur ganz wenige Anbieter am Markt, die dieses Komfortfunktion bieten."
(Jens Eden, Geschäftsführer APRO.CON Software GmbH & Co. KG).
Im Vergleich zu einer normalen Web-App zeichnet sich die PWA zudem mit folgenden Features aus:
- Direkter Zugriff auf die Systemkamera zum Fotografieren von Belegen
- Scannen eines QR-Codes anstatt Andresseingabe für die Verbindung zum ERP-Server
- Anlegen einer Web-Verknüpfung analog zu nativen Apps
- Parallele Verwaltung mehrerer Filialen und Kassenbücher
- Offline-Funktionalität durch Local Storage des Browsers
Durch die intelligente Nutzerverwaltung, die an das Warenwirtschaftssystem von APRO.CON geknüpft ist, können auch im Kassensystem verschiedene Rollen mit unterschiedlichen Berechtigungen sowie mehrere Nutzer-Logins eingerichtet werden.
Als Progressive Web-Applikation wurde das Kassensystem im Frontend mit vue.js und vuetify entwickelt, wobei die Vue-App in unserem Kubernetes-Cluster in einem Docker-Container liegt und über eine REST-Schnittstelle an das Backend von APRO.CON angebunden ist.
Beide Technologien zeichnen sich dadurch aus, dass sie leicht verständlich, individuell integrierbar, in der Entwicklung flexibel und zudem durch eine geringe Größe sehr kompakt sind. Vuetify ist hierbei ein Framework von vue.js, mit dem einfach und schnell Web-Anwendungen gemäß des Material Designs von Google erstellt werden können. Das Besondere daran ist, dass ohne fundierte Kenntnisse im Bereich UI & UX ansprechende Elemente sowie Anwendungen erstellt werden können.
Da das Backend des Warenwirtschaftssystems in der Regel lokal in der Filiale betrieben wird, bleibt die Datenspeicherung sowie -verarbeitung direkt beim Kunden. Die Kassenbuch-App liest angefragte Daten lediglich über SSL verschlüsselte Kommunikationskanäle aus bzw. sendet die von den Nutzern eingetragenen Daten über einen verschlüsselten Kanal an das Backend.
Progressive Web-Apps vs. klassische Web-Applikationen
Die Umsetzung einer Softwarelösung als Progressive Web-Applikation hat sowohl Vor- als auch Nachteile, die vor der Entwicklung sorgfältig analysiert werden sollten.
Im Folgenden präsentieren wir die wichtigsten Besonderheiten einer PWA und zeigen Ihnen, ob Progressive Web-Apps eine Alternative zu klassischen Web-Apps darstellen können.
Online- und Offline-Zugriff sowie automatische Updates
Durch die Verknüpfung von Eigenschaften einer Webseite mit Merkmalen von nativen Applikationen können Progressive Web-Anwendungen auch offline ausgeführt werden. Der ähnliche Look & Feel zu nativen Applikationen ist hier insbesondere hervorzuheben.
Trotz der Möglichkeit des Offline-Zugriffs ist es zu empfehlen eine Progressive Web-App online und mit einer stabilen Internetverbindung auszuführen. Dies bietet den Vorteil, dass Nutzer stets auf die aktuellste Version zugreifen können – ein Vorteil von PWAs, denn...
Ein Nutzer muss sich im Vergleich zu anderen Apps nicht um mögliche Updates kümmern. Dies und noch mehr geschieht dank der Serveranbindung bei progressiven Web-Apps vollkommen automatisch.
Smart, Flexibel und Hochleistungsstark
Des Progressive Web-Apps bestechen im Vergleich zu nativen Applikationen durch einen geringeren Arbeitsaufwand und reduzierte Kosten, da nicht für mehrere verschiedene Betriebssysteme entwickelt werden muss. Ebenso wie native Apps, funktionieren PWAs auch in älteren Browsern und schränken den Nutzer nur bedingt ein, sodass je nach Browser-Kompatibilität zum Beispiel nur auf die Grundfunktionen der Applikation zugegriffen werden kann.
Progressive Web-Apps besitzen aktuell jedoch noch nicht alle Möglichkeiten von klassischen Apps und können so nur bedingt auf Endgeräte und verschiedene Systemressourcen zugreifen. Einbußen in der fehlenden Nutzung von bestimmten Features oder auch Inhalten sind die Folge. Beispielsweise ist eine Positionierung einer PWA im App-Store von Apple aktuell nicht möglich – von Suchmaschinen im Web können Progressive Web-Apps aber durchaus gefunden werden. Auch Notifications oder Push-Benachrichtigungen sind unkompliziert und problemlos möglich.
Insbesondere in der heutigen Zeit, in der die mobile Generation großen Wert auf Geschwindigkeit und Effizienz bei der Nutzung von App- oder auch Web-Anwendungen legt, kann eine PWA punkten, denn: Durch die Nutzung sowohl im Web als auch als App benötigen diese in der Regel wenig Speicherplatz und agieren hochleistungsstark sowie mit deutlich verkürzten Ladezeiten. Diese Funktionsfähigkeit ist unter anderem auch darauf zurückzuführen, dass PWAs in der mobilen Anwendung nicht installiert werden müssen und somit auch keinem Freigabeprozess oder der Kontrolle von Apple sowie Google unterliegen.
Ein weiterer Vorteil von Progressive Web-Apps ist, dass sie im Vergleich zu herkömmlichen Applikationen eine große Flexibilität mit sich bringen, da sich ihr eigener Funktionsumfang stets an den Nutzungsrahmen des Users anpasst und sie somit progressiv sind. Dies bedeutet, dass Nutzer, deren Endgeräte oder Browser zwar nicht mit allen Features der Anwendung kompatibel sind, sie diese dennoch in reduzierter Form nutzen können.
Ein Überblick: PWA versus Native App und Web-App
Folgende Übersicht gibt einen Überblick über die Unterschiede zwischen einer Progressive-Web-App und klassischen App-Formaten:
| PWA | Native App | Web-App | |
|---|---|---|---|
| Installation nötig | nein | ja | nein |
| Über URL aufrufbar | ja | nein | ja |
| Teilen durch Nutzer | einfach | schwierig | einfach |
| Speicherbedarf | gering | groß | gering |
| Kostenaufwand | gering | hoch | hoch |
| Funktionsumfang | eingeschränkt | vollumfänglich | vollumfänglich |
| Offline-Nutzung | ja | nein | nein |
| Browser- und Betriebssystem | eingeschränkt | vollumfänglich | vollumfänglich |
| Plattformunabhängigkeit | ja | nein | ja |
| Entwicklungsaufwand | gering | groß | gering |
Zukunftspotential Anwendung von Progressive-Web-Apps?
Zusammenfassend lässt sich sagen, dass eine PWA je nach Anwendungsfall durchaus eine Alternative zu nativen oder hybriden Apps darstellen kann – vor allem dann, wenn eine Anwendung schnell und kostengünstig umgesetzt sowie offline nutzbar und mobil optimiert genutzt werden soll. Und auf lange Sicht? Für dieses Jahr ist trotz der Vorteile einer PWA keine flächendeckende Verwendung zu erwarten – zu groß sind die noch fehlenden Kompatibilitäten mit unterschiedlichen Browsern und insbesondere mit dem Betriebssystem iOS sowie dem Safari-Browser von Apple.
Positive Anzeichen lassen aber hoffen, dass Progressive-Web-Apps mit der Weiterentwicklung performanter Web-Technologien und einer echten Plattformunabhängigkeit durchaus zu klassischen Web-Apps anschließen können. So arbeitet Microsoft zurzeit an der Integration von Service Workern im Edge-Browser und auch andere Anbieter, wie beispielsweise Mozilla und Opera beschäftigen sich zunehmend immer aktiver mit Progressive Web-Apps. Gleiches gilt für Google, die bereits seit letztem Jahr mit der kostenlosen Technologie „Web App Manifest“ experimentieren, einem Framework, das es erlauben soll mittels weniger Codezeilen eine Webseite in eine App umzuwandeln. Auch wenn sich diese Technologie noch in der Entwicklung befindet, könnte sie bei Erfolg den PWAs zu einer wachsenden Popularität verhelfen und Webseitenbetreibern sowie IT-Unternehmen eine immense Hilfestellung für die Entwicklung von Progressive Web-Apps geben.
Die Zukunft wird also zeigen, ob Progressive Web-Applikationen auch langfristig mit nativen Apps konkurrieren können und inwieweit die namenhaften, weltweit agierenden Unternehmen hierfür Chancen einräumen. Es bleibt spannend und wir bleiben dran!
Unsere PWA-Expertin
Julia Schloen
ist für Sie da!
+49 441 559 770 0
