Local Browser - KI-Webautomatisierung auf dem Gerät

Bald Unterstützung für das runanywhere-web-sdk in unserem Haupt-Repository: bitte schau es dir an: https://github.com/RunanywhereAI/runanywhere-sdks

Eine Chrome-Erweiterung, die WebLLM nutzt, um KI-gestützte Webautomatisierung vollständig auf dem Gerät auszuführen. Keine Cloud-APIs, keine API-Schlüssel, vollständig privat.

Demo

https://github.com/user-attachments/assets/898cc5c2-db77-4067-96e6-233c5da2bae5

Funktionen

• KI auf dem Gerät: Nutzt WebLLM mit WebGPU-Beschleunigung für lokale LLM-Inferenz
• Multi-Agenten-System: Planer- + Navigator-Agenten für intelligente Aufgabenausführung
• Browser-Automatisierung: Navigieren, Klicken, Tippen, Daten aus Webseiten extrahieren
• Datenschutz zuerst: Die gesamte KI läuft lokal, keine Daten verlassen Ihr Gerät
• Offline-Unterstützung: Funktioniert offline nach erstem Model-Download

Schnellstart

Voraussetzungen

• Chrome 124+ (erforderlich für WebGPU in Service Workern)
• Node.js 18+ und npm
• GPU mit WebGPU-Unterstützung (die meisten modernen GPUs funktionieren)

Installation

1. Repository klonen und Abhängigkeiten installieren:

   root@kitploit:~

   cd local-browser
   npm install
   

2. Erweiterung bauen:

   root@kitploit:~

   npm run build
   

3. In Chrome laden:

   • Öffne chrome://extensions
   • Aktiviere 'Entwicklermodus' (oben rechts)
   • Klicke auf 'Entpackte Erweiterung laden'
   • Wähle den Ordner dist aus diesem Projekt

4. Erster Start:

   • Klicke auf das Erweiterungssymbol in deiner Symbolleiste
   • Beim ersten Start wird das KI-Modell (~1GB) heruntergeladen
   • Dies wird für die zukünftige Verwendung zwischengespeichert

Verwendung

1. Navigiere zu einer beliebigen Webseite
2. Klicke auf das Local Browser-Erweiterungssymbol
3. Gib eine Aufgabe ein, wie:
   • "Suche auf Wikipedia nach 'WebGPU' und extrahiere den ersten Absatz"
   • "Gehe zu example.com und sag mir, was dort ist"
   • "Finde das Suchfeld und suche nach 'KI-Nachrichten'"
4. Beobachte, wie die KI die Aufgabe Schritt für Schritt ausführt

Entwicklung

Entwicklungsmodus

npm run dev

Dies überwacht Änderungen und baut automatisch neu.

Projektstruktur

local-browser/
├── manifest.json           # Chrome extension manifest (MV3)
├── src/
│   ├── background/         # Service worker
│   │   ├── index.ts        # Entry point & message handling
│   │   ├── llm-engine.ts   # WebLLM wrapper
│   │   └── agents/         # AI agent system
│   │       ├── base-agent.ts
│   │       ├── planner-agent.ts
│   │       ├── navigator-agent.ts
│   │       └── executor.ts
│   ├── content/            # Content scripts
│   │   ├── dom-observer.ts # Page state extraction
│   │   └── action-executor.ts
│   ├── popup/              # React popup UI
│   │   ├── App.tsx
│   │   └── components/
│   └── shared/             # Shared types & constants
└── dist/                   # Build output

Funktionsweise

1. Benutzer gibt eine Aufgabe in der Popup-Oberfläche ein
2. Planer-Agent analysiert die Aufgabe und erstellt eine übergeordnete Strategie
3. Navigator-Agent untersucht das aktuelle Seiten-DOM und entscheidet über die nächste Aktion
4. Content Script führt die Aktion aus (Klicken, Tippen, Extrahieren usw.)
5. Die Schleife wird fortgesetzt, bis die Aufgabe abgeschlossen ist oder fehlschlägt

Agentensystem

Die Erweiterung verwendet eine Zwei-Agenten-Architektur, inspiriert von Nanobrowser:

• PlannerAgent: Strategische Planung, erstellt einen schrittweisen Ansatz
• NavigatorAgent: Taktische Ausführung, wählt basierend auf dem Seitenzustand spezifische Aktionen aus

Beide Agenten geben strukturiertes JSON aus, das geparst und ausgeführt wird.

Modellkonfiguration

Standardmodell: Qwen2.5-1.5B-Instruct-q4f16_1-MLC (~1GB)

Alternative Modelle (konfiguriert in src/shared/constants.ts):

• Phi-3.5-mini-instruct-q4f16_1-MLC (~2GB, besseres Reasoning)
• Llama-3.2-1B-Instruct-q4f16_1-MLC (~0.7GB, kleiner)

Fehlerbehebung

WebGPU nicht unterstützt

• Aktualisiere Chrome auf Version 124 oder höher
• Überprüfe chrome://gpu, um den WebGPU-Status zu bestätigen
• Manche GPUs unterstützen möglicherweise WebGPU nicht

Modell kann nicht geladen werden

• Stelle sicher, dass genügend Speicherplatz vorhanden ist (~2GB frei)
• Überprüfe die Browser-Konsole auf Fehler
• Versuche, den Speicher der Erweiterung zu leeren und neu zu laden

Aktionen werden nicht ausgeführt

• Manche Seiten blockieren Content Scripts (chrome://, Erweiterungsseiten)
• Versuche es auf einer normalen Webseite wie wikipedia.org

Erweiterung funktioniert nach Chrome-Update nicht

• Gehe zu chrome://extensions
• Klicke auf die Neuladen-Schaltfläche der Erweiterung

Einschränkungen

• POC-Umfang: Dies ist ein Proof-of-Concept, keine Produktionssoftware
• Keine Bildanalyse: Verwendet textbasierte DOM-Analyse (kein Verständnis von Screenshots)
• Einzelner Tab: Funktioniert nur mit dem aktuell aktiven Tab
• Basisaktionen: Unterstützt Navigieren, Klicken, Tippen, Extrahieren, Scrollen, Warten
• Modellgröße: Kleinere Modelle könnten bei komplexen Aufgaben Probleme haben

Technologiestapel

• WebLLM: LLM-Inferenz auf dem Gerät mit WebGPU
• React: Popup-Benutzeroberfläche
• TypeScript: Typsichere Entwicklung
• Vite + CRXJS: Bündelung der Chrome-Erweiterung
• Chrome Extension Manifest V3: Moderne Erweiterungsarchitektur

Danksagungen

Dieses Projekt ist inspiriert von:

• Nanobrowser - Multi-Agenten-Webautomatisierung (MIT-Lizenz)
• WebLLM - LLM-Inferenz im Browser (Apache-2.0-Lizenz)

Abhängigkeitslizenzen

Lizenz

MIT-Lizenz - Siehe LICENSE-Datei für Details.