Eine Progressive Web App ist eine Website, die sich wie eine App installieren und nutzen lässt. Eine PWA bietet ein Icon auf dem Homescreen, ein eigenes Fenster, Offline-Nutzung und Push-Benachrichtigungen. 2026 läuft eine PWA-Codebasis mit Next.js auf Android, Windows, macOS und dem iPhone. Smartphones dominieren den Webverkehr: Laut StatCounter kamen im September 2026 64,97 % des niederländischen und 59,85 % des deutschen Webverkehrs von einem Smartphone. Eine PWA kostet weniger als zwei native Apps. VirtuoLab nennt zum Beispiel eine Orientierung von 5.000 € bis 25.000 € für eine Web-App, gegenüber 40.000 € bis 120.000 € für native Apps. Es gibt zwei Grenzen. Erstens ist der Zugriff auf Hardware wie Bluetooth und NFC eingeschränkt. Zweitens steht eine PWA nicht automatisch im App Store. Schritt 1 ist eine Frage: Braucht die App Hardware oder Store-Sichtbarkeit, die das Web nicht bietet?
Was ist eine Progressive Web App?
Eine Progressive Web App ist eine Website aus Standard-Webtechnik, die das Erlebnis einer installierten App bietet. Der Begriff geht auf einen Artikel von Alex Russell aus dem Juni 2015 zurück. Laut MDN kann eine PWA „auf dem Gerät installiert werden, offline und im Hintergrund arbeiten und sich in das Gerät integrieren“. 2026 machen drei Bausteine aus einer Website eine PWA. Erstens läuft die Website über HTTPS. Zweitens beschreibt ein Web App Manifest Name, Icons, Farben und Anzeigemodus der App. Drittens sitzt ein Service Worker zwischen App und Netzwerk, damit die App Dateien cachen, offline arbeiten und Push-Nachrichten empfangen kann. Nutzer installieren eine PWA direkt aus dem Browser, ohne App Store. In der Praxis ist eine PWA also eine Web-App mit einer zusätzlichen Schicht, kein separates Produkt. Ein Projekt mit Next.js legt das Manifest in einer einzigen Datei fest: app/manifest.ts.
Welche Vorteile hat eine PWA?
Der größte Vorteil einer PWA ist eine Codebasis, die über den Browser jede Plattform erreicht. Erstens läuft derselbe Code auf Android, iPhone, Windows und macOS, es gibt also ein Produkt zum Bauen, Testen und Warten. Zweitens gehen Updates sofort live, weil kein App-Store-Review zwischen einem Fix und dem Nutzer steht. Laut Next.js-Dokumentation sind sofortige Updates ohne Freigabe durch einen App Store ein Kernvorteil einer PWA. Drittens hat jede Ansicht eine URL, sodass Google die Inhalte indexieren und Kunden einen Link teilen können. Zusätzlich hat eine PWA keine Store-Gebühren. 2026 verlangt Apple 99 € pro Jahr für das Entwicklerprogramm und Google Play einmalig 25 €. Auch die Installation ist leicht, weil eine PWA keinen großen Download aus einem Store braucht. Ein Kundenportal mit Next.js wird zum Beispiel auf jedem Gerät installierbar, sobald Manifest und Service Worker live sind.
Wo liegen die Grenzen einer PWA im Vergleich zur nativen App?
Die wichtigste Grenze einer PWA ist der eingeschränkte Zugriff auf Hardware und Funktionen des Betriebssystems. Erstens funktionieren Kamera, Standort und Push-Benachrichtigungen in modernen Browsern, Bluetooth und NFC aber nicht überall. Weil beide APIs in einigen der meistgenutzten Browser nicht funktionieren, kennzeichnet MDN Web Bluetooth und Web NFC 2026 als experimentell. Zweitens steht eine PWA nicht automatisch im App Store oder bei Google Play, wo viele Menschen nach Apps suchen. Drittens laufen aufwendige 3D-Grafik, Spiele und lange Hintergrundaufgaben weiterhin besser als nativer Code. Zusätzlich verlangt Apple laut Richtlinie 4.2 der App Store Review Guidelines, dass Apps mehr bieten als eine neu verpackte Website. In der Praxis ist eine Cross-Platform-App mit React Native oder Flutter die bessere Wahl, wenn Bluetooth-Hardware, In-App-Käufe oder Sichtbarkeit im Store entscheidend sind.
Wie gut funktionieren PWAs 2026 auf dem iPhone?
Das iPhone ist 2026 eine deutlich bessere Plattform für PWAs als noch vor einigen Jahren. Web-Apps auf dem Homescreen können seit iOS und iPadOS 16.4 aus dem Jahr 2023 um Erlaubnis für Push-Benachrichtigungen bitten, so WebKit von Apple. Die Anfrage muss auf eine direkte Nutzeraktion folgen, etwa einen Tipp auf einen Abonnieren-Button. Apple ging 2025 weiter. Mit iOS 26 öffnet sich jede Website, die zum Homescreen hinzugefügt wird, jetzt standardmäßig als Web-App, sogar ohne Manifest. Eine Hürde bleibt. Safari auf iOS unterstützt das Event beforeinstallprompt nicht, daher kann eine PWA auf dem iPhone die Installation nicht über einen eigenen Button auslösen. Die Next.js-Dokumentation empfiehlt deshalb eine kurze Anleitung für iOS-Nutzer: auf Teilen tippen, dann auf Zum Home-Bildschirm. In der Praxis hilft ein Installationshinweis iPhone-Nutzern, die zum ersten Mal eine Web-App über Safari installieren.
Wie schneiden PWA, Cross-Platform-App und native Apps im Vergleich ab?
Die Tabelle vergleicht die drei Wege anhand der Punkte, die bei den meisten Projekten entscheiden.
Welche Projekte passen am besten zu einer PWA?
Eine PWA ist die richtige Wahl, wenn Nutzer über Google oder einen Link kommen und die App vor allem Informationen zeigt und sammelt. Erstens eignet sich ein Kundenportal für Bestellungen, Rechnungen und Tickets, weil Kunden das Portal über einen Link in einer E-Mail öffnen. Zweitens profitiert ein Buchungs- oder Termintool von sofortigen Updates und einem Icon auf dem Homescreen für wiederkehrende Nutzer. Drittens kann eine Service-App für Techniker Formulare lokal speichern und senden, sobald die Verbindung zurück ist. Zusätzlich passen interne Dashboards und Planungstools, zum Beispiel eine Plantafel, die Mitarbeitende auf Laptop und Smartphone nutzen. Zuletzt passt ein MVP gut, weil ein Start-up mit einer Codebasis die Nachfrage testen kann, bevor zwei native Apps für 40.000 € bis 120.000 € bezahlt werden müssen. 2026 ist die entscheidende Frage einfach: Braucht die App Hardware oder Sichtbarkeit im Store, die das Web nicht bieten kann?
Was kostet eine PWA 2026?
Eine PWA ist technisch eine Web-App, daher sind die Preise für Web-Apps der beste Anhaltspunkt. VirtuoLab nennt eine Orientierung von 5.000 € bis 10.000 € für eine einfache Web-App in 3 bis 6 Wochen. Eine mittelgroße Web-App kostet 10.000 € bis 25.000 € und dauert 6 bis 12 Wochen. Die PWA-Schicht selbst, mit Manifest, Service Worker und Push-Benachrichtigungen, bedeutet für eine gut gebaute Web-App überschaubaren Zusatzaufwand. Zum Vergleich: Eine App für beide Plattformen mit React Native oder Flutter kostet 15.000 € bis 60.000 €. Zwei native Apps für iOS und Android kosten 40.000 € bis 120.000 €. Zusätzlich kommen 2026 Store-Konten mit 99 € pro Jahr bei Apple und einmalig 25 € bei Google hinzu, während eine PWA beides nicht braucht. In der Praxis vereinbart VirtuoLab vorab einen Festpreis, nach einem kostenlosen Kennenlerngespräch. Das Hosting kostet so viel wie bei einer normalen Web-App.
Wie bauen Sie eine PWA mit Next.js?
Eine PWA mit Next.js entsteht in fünf Schritten auf Basis einer normalen Web-App. Schritt 1 ist das Web App Manifest: eine Datei app/manifest.ts mit Namen, Icons in 192 und 512 Pixeln, Start-URL und Anzeigemodus. Schritt 2 ist HTTPS, das jede installierbare PWA voraussetzt. Schritt 3 ist ein Service Worker; die Next.js-Dokumentation verweist für vollständiges Offline-Caching auf Serwist. Schritt 4 ist Web Push, mit VAPID-Schlüsseln und einer Server Action, die Benachrichtigungen versendet. Schritt 5 ist der Test auf echten Geräten: Chrome auf Android, Safari auf dem iPhone und ein Desktop-Browser. Laut den Installationskriterien von Google erwartet Chrome außerdem einen Klick auf die Seite und mindestens 30 Sekunden Nutzung, bevor ein Installationsangebot erscheint. In der Praxis brauchen Offline-Verhalten und Push-Benachrichtigungen die meiste Testzeit.
Häufig gestellte Fragen
Kann eine PWA in den App Store oder zu Google Play?
Ja, eine PWA kann zu Google Play, der Weg in den App Store ist jedoch schwieriger. Erstens öffnet eine Trusted Web Activity unter Android die PWA in einer schlanken Android-App. Das Tool Bubblewrap von Google erzeugt danach das Projekt für Google Play. Zweitens ist auf dem iPhone eine native Hülle nötig, gebaut mit Capacitor. Apples Richtlinie 4.2 verlangt Apps, die über eine neu verpackte Website hinausgehen, daher riskiert eine schlicht verpackte Website die Ablehnung. In der Praxis braucht eine PWA für den App Store native Extras, etwa eine Push-Integration oder Gerätefunktionen. Store-Konten kosten 2026 bei Apple 99 € pro Jahr und bei Google einmalig 25 €. Google Play verlangt von neuen privaten Entwicklerkonten, die nach dem 13. November 2023 erstellt wurden, außerdem vor der Veröffentlichung einen geschlossenen Test. Dieser geschlossene Test braucht 12 Tester über 14 Tage. Für viele Business-Apps reicht der Vertrieb über einen Link und den Homescreen.
Funktioniert eine PWA offline?
Ja, eine PWA funktioniert offline für jede Ansicht und jede Datei, die der Service Worker gecacht hat. Der erste Besuch braucht immer eine Verbindung, weil sich der Service Worker bei diesem Besuch installiert. Danach öffnen sich gecachte Seiten, Styles und Daten ohne Netzwerk. Offline-Fähigkeit entsteht nicht automatisch: Ein Entwickler legt pro Ansicht fest, was gecacht wird und was ohne Verbindung erscheint. Schritt 1 ist eine Offline-Seite mit klarer Meldung. Schritt 2 ist das Caching der meistgenutzten Ansichten, und Schritt 3 ist das lokale Speichern von Formularen, bis die Verbindung zurück ist. Ein Entwickler legt die Regeln pro Route mit Serwist fest, der Bibliothek, auf die die Next.js-Dokumentation verweist. Laut HTTP Archive Web Almanac 2025 werden 28,9 % der Top-1.000-Mobilseiten von einem Service Worker gesteuert. In der Praxis ist eine vollständig offline nutzbare Service-App für Techniker die umfassendste Form der Offline-Fähigkeit.
Ist eine PWA gut für SEO?
Ja, eine PWA ist gut für SEO, weil eine PWA eine Website mit echten URLs ist, die Google crawlen und indexieren kann. Eine native App erscheint dagegen nur über eine Store-Seite in den Suchergebnissen. Schritt 1 ist Server-Rendering: Eine PWA, die alles im Browser rendert, zeigt Google zuerst eine fast leere Seite. Eine Website mit Next.js rendert Seiten auf dem Server oder im Voraus, sodass Inhalte sofort sichtbar sind. Schritt 2 ist Geschwindigkeit, weil Core Web Vitals von den Ranking-Systemen von Google genutzt werden. Zusätzlich kann ein Service Worker wiederholte Besuche beschleunigen, indem er Dateien aus dem Cache liefert. Ein Kundenportal mit öffentlichen Hilfeseiten kann zum Beispiel mit jedem Hilfeartikel ranken. Die native Version desselben Portals hat nur eine Store-Seite. Der Artikel zur Website-Performance-Optimierung beschreibt die Schritte zu schnelleren Ladezeiten 2026.