Progressive Web Apps (PWA): Die App, die keine Installation braucht

Das Problem mit nativen Apps

Native Apps — für iOS oder Android entwickelt — bieten die beste Nutzererfahrung. Sie sind schnell, können auf Gerätehardware zugreifen und funktionieren offline. Aber sie haben erhebliche Nachteile für Unternehmen:

• Entwicklungskosten: Eine native App für iOS und Android kostet 20.000–100.000 €
• Zwei Codebases: iOS und Android müssen separat entwickelt und gewartet werden
• App-Store-Abhängigkeit: Apple und Google kontrollieren Verteilung und Preise (15–30% Provision bei In-App-Käufen)
• Update-Prozess: Nutzer müssen Updates manuell installieren
• Installations-Hürde: Viele Nutzer laden keine App für einen gelegentlichen Dienst herunter

Progressive Web Apps (PWAs) lösen diese Probleme — bei deutlich geringeren Kosten.

Was ist eine Progressive Web App?

Eine PWA ist eine Website, die mit modernen Web-Technologien so erweitert wird, dass sie sich wie eine native App verhält.

Was PWAs können:

• Offline-Funktionalität: Dank Service Worker werden Daten und Seiten gecacht — die App funktioniert auch ohne Internetverbindung
• Zum Homescreen hinzufügen: Nutzer können die PWA wie eine echte App auf dem Homescreen ablegen
• Push-Benachrichtigungen: Benachrichtigungen direkt auf dem Gerät (auf Android vollständig, auf iOS seit 2023 möglich)
• Kamera und Mikrofon: Zugriff auf Gerätehardware (mit Nutzererlaubnis)
• Hintergrund-Synchronisation: Daten werden synchronisiert, sobald eine Verbindung verfügbar ist
• Installierbar: Auf Wunsch als echte App installierbar (ohne App Store)

Was PWAs nicht können:

• Tiefer Zugriff auf Gerätehardware (Bluetooth, NFC) — hier sind native Apps überlegen
• Auf iOS: noch eingeschränktere PWA-Unterstützung als auf Android (Apple bremst PWAs aktiv)

Die technischen Grundlagen einer PWA

1. Service Worker

Ein Service Worker ist ein JavaScript-Skript, das im Hintergrund läuft — unabhängig von der eigentlichen Website. Er ist verantwortlich für:

• Caching von Seiten und Ressourcen (ermöglicht Offline-Nutzung)
• Hintergrund-Synchronisation
• Push-Benachrichtigungen

2. Web App Manifest

Eine JSON-Datei, die der Browser liest und beschreibt, wie die App aussehen und sich verhalten soll: Name, Icon, Startseite, Anzeigemodus (Vollbild, Browser, etc.).

3. HTTPS

PWAs erfordern zwingend HTTPS. Service Worker funktionieren nur auf sicheren Verbindungen.

PWA vs. Native App vs. Responsive Website

Merkmal	Responsive Website	PWA	Native App
Entwicklungskosten	Günstig	Mittel	Hoch
Offline-Funktion	❌	✅	✅
Push-Notifications	❌	✅ (mit Einschränkungen)	✅
App-Store nötig	❌	❌	✅
Gerätezugriff	Eingeschränkt	Mittel	Vollständig
Update-Prozess	Sofort	Sofort	Manuell
iOS-Support	✅	Eingeschränkt	✅
Findbarkeit (SEO)	✅	✅	❌

Wann ist eine PWA die richtige Wahl?

PWA macht Sinn wenn...

Stammkunden nutzen die Anwendung regelmäßig Ein Terminbuchungssystem, das Kunden regelmäßig nutzen, profitiert von PWA-Features: Homescreen-Icon, Offline-Puffering, Push-Benachrichtigungen für Terminerinnerungen.

Offline-Nutzung wichtig ist Außendienstmitarbeiter, die Aufträge auch ohne Netz erfassen müssen. Checklisten-Apps für Handwerker, die in Kellern ohne Signal arbeiten.

Geringe Installations-Hürde gewünscht ist Kunden sollen nicht extra eine App aus dem App Store laden müssen. Die PWA ist direkt über die Website zugänglich.

Budget für native App fehlt PWAs kosten typischerweise 30–60% weniger als eine vergleichbare native App — bei 70–80% der Funktionalität.

PWA macht weniger Sinn wenn...

• Tiefe Hardware-Integration nötig ist (Bluetooth, komplexe Kamera-Features)
• iOS die primäre Zielplattform ist (Apple schränkt PWA-Features ein)
• Distributation über den App Store gewünscht ist (Auffindbarkeit, Markenwahrnehmung)
• Die App für komplexe Offline-Szenarien mit großen Datenmengen genutzt wird

Praxisbeispiele: PWAs für KMU

Kunden-Portal für einen Handwerksbetrieb

Kunden können den Status laufender Aufträge einsehen, Dokumente herunterladen und neue Aufträge anfragen. Als PWA: Homescreen-Icon, Offline-Ansicht bereits gespeicherter Dokumente, Push-Benachrichtigung wenn ein Auftrag abgeschlossen ist.

Terminbuchungs-System

Kunden buchen Termine, erhalten Bestätigung und Erinnerung via Push-Notification. Offline-Puffer zeigt die nächsten gebuchten Termine auch ohne Netz an.

Internes Mitarbeiter-Tool

Checklisten, Auftragserfassung, Zeiterfassung — auch in Bereichen ohne Netz nutzbar, automatische Synchronisation wenn Verbindung wieder da ist.

Was kostet eine PWA?

Für eine einfache PWA (bestehende Website mit PWA-Features erweitern): 2.000–5.000 € Für eine vollständige Web-App als PWA: 10.000–40.000 €

Im Vergleich: Native App für iOS + Android: 30.000–100.000 €+

PWA mit Next.js entwickeln

SW Business Solutions entwickelt PWAs auf Basis von Next.js. Next.js bietet hervorragende PWA-Unterstützung:

• next-pwa Plugin für einfache Service-Worker-Integration
• Automatisches Caching von statischen Assets
• App Router für granulares Caching-Verhalten

Für viele KMU-Anforderungen ist Next.js + PWA die optimale Kombination aus Performance, SEO und App-ähnlicher Nutzererfahrung.

Häufig gestellte Fragen (FAQ)

Kann ich meine bestehende Website in eine PWA umwandeln? Ja — wenn die Website bereits HTTPS verwendet und technisch sauber entwickelt ist, können PWA-Features (Manifest, Service Worker) nachträglich hinzugefügt werden. Der Aufwand hängt von der Komplexität der gewünschten Features ab.

Funktionieren PWAs auf iPhones? Eingeschränkt. Apple unterstützt PWAs auf iOS, aber mit Einschränkungen: Push-Notifications seit iOS 16.4 möglich, aber nur wenn die PWA aktiv installiert (Homescreen) ist. Hintergrund-Synchronisation funktioniert schlechter als auf Android.

Erscheinen PWAs im App Store? Nein — das ist gleichzeitig Vor- und Nachteil. Kein App Store nötig, aber auch keine automatische Auffindbarkeit dort. Google Play Store unterstützt seit 2019 "Trusted Web Activities" (TWA) — damit kann eine PWA verpackt und im Play Store veröffentlicht werden.

Wie groß ist der Unterschied zwischen PWA und nativer App wirklich? Für einfache bis mittlere Anforderungen (Terminbuchung, Kunden-Portal, Informations-App) ist der Unterschied für Endnutzer minimal. Für anspruchsvolle Anwendungen (Augmented Reality, komplexe Offline-Synchronisation) sind native Apps noch überlegen.