Eine Progressive Webanwendung (PWA) ist eine Webanwendung, die moderne Webfähigkeiten nutzt, um den Benutzern ein APP-ähnliches Erlebnis zu bieten. Diese Anwendungen erfüllen bestimmte Anforderungen (siehe unten), werden auf Webservern bereitgestellt und sind über URLs (auf dem HTTPS-Protokoll) zugänglich.

Dies kann in Verbindung mit Cordova funktionieren, um eine Vielzahl von Einsatzzielen für alle Ihre Benutzer bereitzustellen. Mit Quasar CLI können Sie Ihre Anwendung sowohl als PWA als auch als mobile Anwendung bereitstellen und die Vorteile beider Kanäle nutzen.

Was ist erforderlich, damit Ihre Anwendung als progressive Webanwendung betrachtet werden kann?

• Progressiv – Sie funktionieren für jeden Benutzer, unabhängig von der Wahl des Browsers, da sie mit progressiver Verbesserung als Kernprinzip aufgebaut sind.
• Reaktionsfähig – Passt auf jeden Formfaktor, Desktop, Handy, Tablet oder was auch immer als Nächstes kommt.
• Konnektivitätsunabhängig – Erweitert um Service-Mitarbeiter, die offline oder in Netzwerken mit niedriger Qualität arbeiten können.
• App-ähnlich – Verwenden Sie das App-Shell-Modell, um Navigation und Interaktionen im App-Stil zu ermöglichen. Frisch – Immer auf dem neuesten Stand dank des Aktualisierungsprozesses für Service-Mitarbeiter.
• Sicher – Wird über HTTPS bereitgestellt, um Schnüffelei zu verhindern und sicherzustellen, dass Inhalte nicht manipuliert wurden.
• Entdeckbar – Sind dank W3C-Manifesten und dem Registrierungsumfang für Service-Mitarbeiter als „Anwendungen“ identifizierbar, sodass sie von Suchmaschinen gefunden werden können.
• Wiederaufrufbar – Erleichtern den Wiederaufruf durch Funktionen wie Push-Benachrichtigungen.
• Installierbar – Erlaubt es Benutzern, Anwendungen, die sie am nützlichsten finden, auf ihrem Home-Bildschirm zu „behalten“, ohne dass ein App-Store erforderlich ist.
• Verlinkbar – Einfache Freigabe über URL und keine komplexe Installation erforderlich. Weitere Informationen finden Sie in Addy Osmanis Artikel über PWA.

Die Manifest-Datei und der Service Worker

Eine App-Manifestdatei beschreibt die Ressourcen, die Ihre App benötigt. Dazu gehören der angezeigte Name Ihrer Anwendung, Symbole sowie der Startbildschirm. Quasar CLI konfiguriert dies für Sie, aber Sie können jede Eigenschaft von quasar.conf.js aus überschreiben.

Der Service Worker bietet eine programmatische Möglichkeit, App-Ressourcen (Dateien) zwischenzuspeichern. Die programmatische API ermöglicht es Entwicklern zu entscheiden, wie mit dem Caching umgegangen werden soll, und bietet eine viel flexiblere Erfahrung als andere Optionen. Weitere Informationen: API für Dienstmitarbeiter.

Progressive Web Apps (PWAs): Aktuelle Entwicklungen und Trends 2023-2025

Eine Progressive Webanwendung (PWA) ist eine Webanwendung, die moderne Webfähigkeiten nutzt, um den Benutzern ein APP-ähnliches Erlebnis zu bieten. Seit der Veröffentlichung des ursprünglichen Artikels haben sich PWAs erheblich weiterentwickelt. Hier ist ein umfassender Überblick über die neuesten Entwicklungen und Trends von 2023 bis heute (März 2025).

Marktentwicklung und Wachstum

Der PWA-Markt befindet sich in einer beeindruckenden Wachstumsphase. Im Jahr 2023 wurde die Marktgröße auf etwa 1,4 Milliarden USD geschätzt. Für 2025 wird ein Anstieg auf 2,8 Milliarden USD prognostiziert, und langfristige Prognosen sagen sogar ein Wachstum auf 13,3 Milliarden USD bis 2032 mit einer jährlichen Wachstumsrate von 28,6% voraus. Diese Zahlen unterstreichen die zunehmende Bedeutung von PWAs in der digitalen Landschaft.

Technologische Fortschritte und neue Funktionen

Erweiterte Benutzeroberflächen

Window Controls Overlay: Diese Funktion, verfügbar in Edge und Chrome, ermöglicht es PWAs, mehr wie native Anwendungen auszusehen, indem der für die Fenstersteuerelemente des Browsers reservierte Platz genutzt werden kann. Ab Microsoft Edge 121 können Entwickler diese Funktion in DevTools simulieren, ohne die PWA installieren zu müssen.

Windows 11 Widgets: PWAs, die auf Edge laufen, können nun Widgets für die Widget-Leiste in Windows 11 definieren, was eine tiefere Integration in das Betriebssystem ermöglicht.

Edge Side Panel: Progressive Web Apps können jetzt die Seitenleiste in Microsoft Edge nutzen, was es der App ermöglicht, parallel zu anderen Inhalten zu laufen – ideal für Produktivitätsanwendungen.

Verbesserte Plattformunterstützung

iOS-Unterstützung: Seit 2023 haben sich PWAs auf iOS erheblich weiterentwickelt und bieten eine native app-ähnlichere Erfahrung. iOS 13 führte ein neues Share Sheet Design ein, das den Prozess der Hinzufügung von PWAs zum Startbildschirm intuitiver gestaltet, und unterstützt den Dark Mode.

Es gab jedoch auch Herausforderungen: In der Beta-Version von iOS 17.4 schränkte Apple vorübergehend die Funktionalität von PWAs für Nutzer in der EU drastisch ein, was nach öffentlichem Druck wieder rückgängig gemacht wurde.

Offline-Funktionalität und Leistung

Die Offline-Fähigkeit wurde durch Verbesserungen des Service Workers weiter optimiert, was PWAs noch zuverlässiger macht, selbst bei instabiler Internetverbindung. Service Worker ermöglichen auch eine effizientere Hintergrundaktualisierung von Ressourcen und Daten, selbst wenn die Anwendung nicht aktiv geöffnet ist.

Integration moderner Technologien

Die Integration von Künstlicher Intelligenz, 5G-Technologie und Augmented Reality/Virtual Reality revolutioniert die Fähigkeiten von PWAs. KI verbessert die Funktionalitäten erheblich und erhöht die Leistungsfähigkeit und Benutzerfreundlichkeit, während 5G die Leistung und Reaktionsfähigkeit der Anwendungen steigert.

Branchenspezifische Entwicklungen

E-Commerce

PWAs spielen eine zentrale Rolle im E-Commerce, wo sie Kundenerwartungen gerecht werden und ein verbessertes Einkaufserlebnis bieten. Die Technologie vereint die Bedienbarkeit und Leistungsfähigkeit einer Desktopwebsite mit den Funktionen einer App, wodurch unschlagbare Vorteile für Shopbetreiber und Endkunden entstehen.

Unternehmensanwendungen

Spezifische PWA-Updates für Unternehmenslösungen zeigen die Vielseitigkeit dieser Technologie. Das Rothballer PWA-Update 02/2024 führte beispielsweise neue Funktionen wie Versorgungsdatenexport zur Statistikauswertung und Einzelscan der Füße ein.

PWAs im Vergleich zu nativen Apps

Bei der Entscheidung zwischen PWAs und nativen Apps im Jahr 2025 bieten PWAs mehrere entscheidende Vorteile:

• Progressive Verbesserung: PWAs funktionieren für alle Nutzer, unabhängig von Browser- oder Gerätefunktionen
• App-ähnliche Erfahrung: Inklusive flüssiger Animationen, Offline-Funktionen und Push-Benachrichtigungen
• Verbesserte Auffindbarkeit: PWAs sind über Suchmaschinen, soziale Medien und geteilte Links leichter zu finden
• Niedrigere Entwicklungskosten: Ein einziger Codebase für alle Plattformen

Zukünftige Entwicklungen

Das World Wide Web Consortium (W3C) arbeitet an neuen Webschnittstellen, um die Lücke zwischen nativen Apps und PWAs weiter zu schließen:

• Writable Files API: Ermöglicht PWAs den Zugriff auf einen Teilbereich des nativen Dateisystems
• Badging API: Erlaubt das Setzen von Notification-Badges
• Shape Detection API: Ermöglicht die Erkennung von Barcodes, Gesichtern oder Text in Bildern

Adoption und Verbreitung

Trotz der zahlreichen Vorteile verwenden derzeit nur knapp unter 2 Prozent aller Websites Service Worker, obwohl dieser Anteil bei den beliebtesten Websites deutlich höher ist. Mit zunehmender Bekanntheit und verbesserten Funktionen ist jedoch mit einer steigenden Adoption zu rechnen.

Fazit

Progressive Web Apps haben sich seit 2023 erheblich weiterentwickelt und werden weiterhin an Bedeutung gewinnen, besonders in Bereichen wie E-Commerce, wo eine nahtlose Benutzererfahrung über verschiedene Geräte hinweg entscheidend ist. Die technologischen Fortschritte ermöglichen es PWAs, native App-Funktionen immer besser zu imitieren, während sie gleichzeitig die Vorteile von Webanwendungen beibehalten.

Für Unternehmen, die ihre digitale Präsenz optimieren möchten, stellen PWAs eine kostengünstige, zukunftssichere Lösung dar, die eine breite Nutzerbasis erreichen kann, unabhängig von Gerät oder Plattform. Mit der weiteren Integration von KI und anderen fortschrittlichen Technologien werden PWAs in den kommenden Jahren voraussichtlich noch leistungsfähiger und vielseitiger werden.

Quellen der Inspiration

https://pwa.ist/pwa/
https://web.dev/progressive-web-apps/
https://developer.mozilla.org/de/docs/Web/Progressive_web_apps
https://www.pwastats.com/
https://www.microsoft.com/en-us/edge/business/progressive-web-apps
https://www.smashingmagazine.com/2023/10/progressive-web-apps-status-update/
https://learn.microsoft.com/en-us/microsoft-edge/progressive-web-apps-chromium/
https://web.dev/articles/window-controls-overlay
https://developer.apple.com/documentation/webkit/progressive_web_apps

Video: Was ist eine Progressive Web App?