Zum Hauptinhalt springen

Offline-Unterstützung

AISCouncil ist eine Progressive Web App (PWA), die nach dem ersten Besuch offline funktioniert. Die gesamte Anwendung ist eine einzelne HTML-Datei ohne externe Abhängigkeiten, sodass sie vollständig vom Service Worker des Browsers gecacht werden kann.

Progressive Web App (PWA)

Die App registriert einen Service Worker (sw.js), der alle statischen Assets beim ersten Laden cacht. Bei nachfolgenden Besuchen lädt die App sofort aus dem Cache – sogar ohne Internetverbindung.

Als App installieren

Chrome / Edge (Desktop):

  1. Besuchen Sie aiscouncil.net
  2. Klicken Sie auf das Installations-Symbol in der Adressleiste (oder gehen Sie zu Menü > "AISCouncil installieren")
  3. Die App öffnet sich in ihrem eigenen Fenster, mit eigenem Taskbar-Eintrag

Chrome / Edge (Android):

  1. Besuchen Sie aiscouncil.net
  2. Tippen Sie auf das Browser-Menü (drei Punkte)
  3. Wählen Sie "Zum Startbildschirm hinzufügen" oder "App installieren"

Safari (iOS / macOS):

  1. Besuchen Sie aiscouncil.net
  2. Tippen Sie auf die Teilen-Schaltfläche
  3. Wählen Sie "Zum Home-Bildschirm"
Tipp

Wenn als PWA installiert, läuft die App im standalone-Modus – keine Browser-Chrome, Vollbild-Erlebnis, und sie erscheint als native App in Ihrem Task-Wechsler.

Service Worker Caching-Strategie

Der Service Worker verwendet eine Stale-While-Revalidate-Strategie:

  1. Erster Besuch: Alle vorgecachten Assets werden heruntergeladen und im Cache gespeichert
  2. Nachfolgende Besuche: Die gecachte Version wird sofort bereitgestellt (null Netzwerklatenz), während der Service Worker im Hintergrund eine aktualisierte Version abruft
  3. Nächster Besuch nach Update: Die aktualisierte Version wird aus dem Cache bereitgestellt

Das bedeutet, Sie erhalten immer sofortige Ladezeiten, und Updates kommen stillschweigend im Hintergrund an.

Was gecacht wird

Der Service Worker precacht diese Dateien bei der Installation:

DateiZweck
/HTML-Shell (leitet zu /index.html weiter)
/index.htmlDie vollständige Anwendung (~alles JS, CSS und HTML inline)
/icon.svgVektor-App-Icon
/icon-192.png192x192 PNG-Icon (Android Home-Screen)
/icon-512.png512x512 PNG-Icon (Splash-Screens, maskable)
/favicon.icoBrowser-Tab-Favicon
/manifest.webmanifestPWA-Manifest (Name, Icons, Theme-Farbe)

Zusätzlich wird jede Same-Origin-GET-Anfrage, die die App macht, beim ersten Abruf gecacht und bei nachfolgenden Anfragen aus dem Cache bereitgestellt (stale-while-revalidate).

Was NICHT gecacht wird

RessourceWarum
LLM-API-AufrufeDiese gehen direkt an Anbieter-APIs (Anthropic, OpenAI, etc.) und erfordern eine Internetverbindung
Registry-UpdatesModell-Registry-Fetches von GitHub erfordern Netzwerk, aber die App fällt auf gecachte/gebundelte Daten zurück
Cross-Origin-RessourcenNur Same-Origin-Anfragen werden vom Service Worker gecacht
POST/PUT/DELETE-AnfragenNur GET-Anfragen werden gecacht
API-Proxy-AufrufeAnfragen an /v1/* sind explizit vom Caching ausgeschlossen

Offline-Fähigkeiten

Wenn offline, können Sie:

  • Bestehende Chats durchsuchen – der gesamte Chat-Verlauf ist lokal in IndexedDB gespeichert
  • Profile verwalten – Bot-Profile erstellen, bearbeiten und löschen
  • Einstellungen ansehen und ändern – alle Einstellungen sind im localStorage
  • Daten exportieren – Ihre Backup-JSON-Datei herunterladen
  • Zwischen Bots wechseln – alle Bot-Konfigurationen sind lokal gespeichert
  • Vorherige Konversationen lesen – vollständiger Nachrichtenverlauf verfügbar

Wenn offline, können Sie nicht:

  • Neue Nachrichten senden – erfordert einen API-Aufruf an den LLM-Anbieter
  • Die Modell-Registry aktualisieren – erfordert Fetch von GitHub
  • Anmelden – OAuth erfordert Netzwerkkonnektivität
  • Mini-Programme installieren – erfordert Abrufen von Manifest und Entry-HTML
Info

Ollama-Benutzer mit einer lokalen Instanz können weiterhin offline chatten, da Ollama auf localhost läuft und keinen Internetzugang erfordert.

Cache-Versionierung

Der Service Worker verwendet einen versionierten Cache-Namen:

const CACHE = "ais-v1.0.0";

Wenn sich der Versions-String ändert (bei einem Breaking-Update), macht der neue Service Worker:

  1. Erstellt einen neuen Cache mit dem neuen Namen
  2. Precacht alle Assets in den neuen Cache
  3. Löscht bei der Aktivierung alle alten Caches
  4. Claimt alle offenen Clients

Dies stellt sicher, dass veralteter gecachter Code nach großen Updates bereinigt wird.

Die App aktualisieren

Updates passieren automatisch:

  1. Wenn Sie die Seite besuchen, prüft der Browser, ob sich sw.js geändert hat
  2. Wenn ja, wird der neue Service Worker im Hintergrund installiert
  3. Beim nächsten Laden der Seite (oder nachdem alle Tabs geschlossen und wieder geöffnet wurden) aktiviert der neue Service Worker
  4. Die neue Version wird nun aus dem Cache bereitgestellt
Update erzwingen

Um ein sofortiges Update zu erzwingen: öffnen Sie DevTools > Application > Service Workers, klicken Sie "Update" auf dem registrierten Service Worker, dann laden Sie die Seite neu. Alternativ halten Sie Shift und klicken Sie auf den Reload-Button des Browsers, um den Cache zu umgehen.

Web App Manifest

Die manifest.webmanifest-Datei definiert, wie die App erscheint, wenn sie installiert ist:

{
"name": "AISCouncil",
"short_name": "AISCouncil",
"description": "Chatte mit Claude, GPT oder Grok – kein Server, kein Setup.",
"start_url": "/",
"display": "standalone",
"background_color": "#000000",
"theme_color": "#7c3aed",
"categories": ["productivity", "utilities"],
"icons": [
{ "src": "icon.svg", "sizes": "any", "type": "image/svg+xml" },
{ "src": "icon-192.png", "sizes": "192x192", "type": "image/png" },
{ "src": "icon-512.png", "sizes": "512x512", "type": "image/png" },
{
"src": "icon-512.png",
"sizes": "512x512",
"type": "image/png",
"purpose": "maskable"
}
]
}
FeldWertZweck
displaystandaloneLäuft ohne Browser-UI (Adressleiste, Tabs)
orientationanyFunktioniert im Hoch- und Querformat
theme_color#7c3aedLila Akzent für Statusleiste und Titelleiste
background_color#000000Splash-Screen-Hintergrund während die App lädt

Fehlerbehebung

Die App zeigt eine alte Version:

  • Öffnen Sie DevTools > Application > Service Workers
  • Klicken Sie "Unregister" auf dem alten Service Worker
  • Laden Sie die Seite neu

Die App funktioniert nicht offline:

  • Stellen Sie sicher, dass der Service Worker registriert ist (DevTools > Application > Service Workers)
  • Stellen Sie sicher, dass Sie die Seite mindestens einmal online besucht haben
  • Prüfen Sie, dass der Cache existiert (DevTools > Application > Cache Storage)
  • Einige Browser im Private/Incognito-Modus deaktivieren Service Worker

Der Installations-Prompt erscheint nicht:

  • Die Seite muss über HTTPS (oder localhost) bereitgestellt werden
  • Der Service Worker muss registriert und aktiv sein
  • Das Manifest muss gültig und im HTML-<head> verlinkt sein
  • Sie müssen die Seite mindestens zweimal mit etwas Zeit dazwischen besucht haben (Browser-Heuristik)