Eine App, die beim ersten Funkloch nur eine weiße Seite zeigt, verärgert Nutzer und fällt im App-Review negativ auf. Lovable-Apps sind zunächst klassische Web-Anwendungen, die jede Seite und jeden Datensatz aus dem Netz laden. Offline-Fähigkeit ist deshalb kein Schalter, sondern eine Abstufung: von einer freundlichen Hinweisseite bis zur vollständigen lokalen Datenhaltung mit Synchronisierung. Hier erfahren Sie, welche Stufe für Ihre App sinnvoll ist und wie Sie sie erreichen.
Vier Stufen der Offline-Fähigkeit
Stufe eins ist eine eigene Offline-Seite, die die App anzeigt, wenn keine Verbindung besteht, inklusive Button zum erneuten Laden. Stufe zwei hält die Oberfläche selbst vor, also JavaScript, CSS und Bilder, sodass die App zumindest startet. Stufe drei zeigt zuletzt geladene Daten an, nur lesend. Stufe vier erlaubt auch Änderungen offline, die später mit Supabase synchronisiert werden.
Für die meisten Business-Apps reichen Stufe eins bis drei. Stufe vier lohnt sich bei Außendienst-, Inspektions- oder Lager-Apps, bei denen Nutzer regelmäßig ohne Netz arbeiten. Sie bringt allerdings echte Komplexität mit, vor allem bei Konflikten, wenn zwei Personen denselben Datensatz ändern.
Bei der Wahl der Stufe hilft eine einfache Überlegung: Was kostet es, wenn ein Nutzer eine Minute lang nicht arbeiten kann? Bei einer Vereins-App ist das ärgerlich, bei einer Prüf-App auf einer Baustelle ohne Empfang kann es den Einsatz der ganzen Anwendung infrage stellen. Je höher der Schaden, desto eher lohnt sich der Aufwand für lokale Daten und Synchronisierung.
Was im WebView funktioniert und was nicht
Mit einem WebView-Template wie WebViewGold erreichen Sie Stufe eins ohne Programmierung: Die App erkennt fehlende Verbindung und zeigt eine lokal mitgelieferte Seite. Für Stufe zwei und drei kommt im Web meist ein Service Worker zum Einsatz, in Vite-Projekten etwa über ein PWA-Plugin. Android-WebViews unterstützen Service Worker. Unter iOS ist die Unterstützung in WKWebView an App-Bound Domains geknüpft und damit eingeschränkt.
Wer auf beiden Plattformen verlässlich offline starten möchte, liefert die Oberfläche deshalb lokal mit der App aus. Das gelingt mit Capacitor, das den gebauten dist-Ordner Ihres Lovable-Projekts in die App packt. Daten werden dann zusätzlich lokal gespeichert, etwa in IndexedDB oder SQLite.
Vorgehen in der Praxis
Gehen Sie schrittweise vor, statt sofort eine Synchronisierung zu bauen:
Dokumentieren Sie die Entscheidungen zur Konfliktlösung, etwa ob die letzte Änderung gewinnt oder Nutzer selbst wählen. Diese Regel muss auch für Ihr Supportteam nachvollziehbar sein, wenn sich später jemand über verlorene Eingaben beschwert.
- Listen Sie auf, welche Bildschirme Nutzer ohne Netz wirklich brauchen und welche Daten dafür nötig sind.
- Richten Sie eine aussagekräftige Offline-Seite ein, die erklärt, was gerade nicht geht, und einen erneuten Versuch anbietet.
- Cachen Sie die App-Oberfläche und zuletzt geladene Daten, zum Beispiel mit einer persistierten Abfrage-Bibliothek wie TanStack Query.
- Nur wenn nötig: Bauen Sie eine Warteschlange für Änderungen, die bei Verbindung an Supabase übertragen wird, und legen Sie Regeln für Konflikte fest.
- Testen Sie im Flugmodus, bei schwachem Netz und beim Wechsel zwischen WLAN und Mobilfunk.
Stolpersteine und Review-Aspekte
Achten Sie darauf, dass sensible Daten nicht ungeschützt auf dem Gerät liegen und beim Logout gelöscht werden. Supabase-Row-Level-Security schützt die Datenbank, aber nicht den lokalen Cache. Ebenfalls wichtig: Ein abgelaufenes Login-Token darf offline nicht dazu führen, dass Nutzer ausgesperrt werden und ihre nicht synchronisierten Änderungen verlieren.
Im App-Review testet Apple gelegentlich unter schlechten Netzbedingungen. Eine leere Seite oder endlos drehende Ladeanzeige kann als unvollständige App nach Guideline 2.1 gewertet werden. Eine saubere Offline-Seite ist daher Pflicht, nicht Kür.
Zeigen Sie zudem klar an, ob die App gerade online ist und ob noch Änderungen auf die Übertragung warten. Ein kleiner Statushinweis schafft Vertrauen und verhindert doppelte Eingaben.
Passende Unterstützung
Für die Offline-Seite und Basisfunktionen genügt WebViewGold. Wenn Ihre App echte Offline-Arbeit mit Synchronisierung braucht, setzen unsere AI Code Engineers das über neooutput mit Capacitor und lokaler Datenbank um. Lassen Sie uns in einem kostenlosen 15-Minuten-Erstgespräch klären, welche Stufe Sie benötigen.
Häufige Fragen
Kann Lovable selbst eine Offline-App erzeugen?
Lovable kann Service Worker und lokales Caching in den Code einbauen, wenn Sie es gezielt anfordern. Für eine robuste Offline-Fähigkeit in iOS-Apps reicht das allein jedoch oft nicht, weil WKWebView Service Worker nur eingeschränkt unterstützt.
Funktioniert Supabase offline?
Supabase ist ein Cloud-Backend und braucht eine Verbindung. Offline arbeiten Sie mit einer lokalen Kopie der Daten, die Ihre App später mit Supabase abgleicht.
Verlangt Apple Offline-Fähigkeit?
Nicht ausdrücklich. Apple erwartet aber, dass die App sich bei fehlender Verbindung vernünftig verhält und nicht leer oder kaputt wirkt.