PartyKit + Cloudflare Vectorize: Eine semantische Such‑Engine in 160 Zeilen

Die Kombination von PartyKit, Cloudflare Vectorize und Workers‑AI ermöglicht es, in nur etwa 160 Zeilen einen hochqualitativen, semantischen Such‑Engine für statische Webseiten aufzubauen – und das ohne eigene Infrastruktur.

Key Takeaway

Die Kombination von PartyKit, Cloudflare Vectorize und Workers‑AI ermöglicht es, in nur etwa 160 Zeilen einen hochqualitativen, semantischen Such‑Engine für statische Webseiten aufzubauen – und das ohne eigene Infrastruktur.

Summary

• Konzeptuelle Grundlagen
  • Embeddings: Text in einen hochdimensionalen Vektorraum abbilden, sodass semantisch ähnliche Texte nahe beieinander liegen.
  • Vektor‑Datenbank: Speichert Vektoren und liefert schnelle Nachbarschaftsabfragen (KNN).
• PartyKit‑Features
  • Neue APIs für eine eingebaute Vektor‑Datenbank (Vectorize) und Zugriff auf einen Embedding‑Modell‑Endpoint (Workers AI).
  • Einfache Integration über das PartyKit‑CLI (npx partykit vectorize …) und Konfigurationsdatei (partyik.json).
• Projekt‑Aufbau (Beispiel: Braggoscope)
  1. PartyKit‑Projekt + Web‑UI: Remix Starter Template, partykit‑ai‑Bibliothek installieren.
  2. Setup:
     • Vektor‑Index erstellen: npx partykit vectorize create braggoscope-index –preset @cf/baai/bge-base-en-v1.5.
     • Konfiguration in partyik.json ergänzen (Index‑Name + ai: true).
  3. Indexierung:
     • Inhalt der 1.000+ Podcast‑Episoden wird in einer JSON‑Datei bereitgestellt.
     • search.ts nutzt this.ai.run(“@cf/baai/bge-base-en-v1.5”, …) zur Generierung von Vektoren.
     • Vektoren mit Metadaten (Titel, Datum, Permalink) werden in die Datenbank geschoben (vectorize.searchIndex.upsert).
     • Index‑Erstellung wird per Web‑UI mit Secret‑Key gestartet und per WebSocket über Progress informiert.
  4. Suche:
     • searchIndex.query(…) findet die nächsten Vektoren basierend auf der Abfrage‑Embeddings.
     • Rückgabe beinhaltet die gespeicherten Metadaten zur Anzeige.
  5. API:
     • search.ts enthält onRequest‑Handler für POST‑Requests von der Front‑End‑Seite.
     • CORS‑Header werden gesetzt, sodass z. B. braggoscope.com die Suche auslösen kann.
• Schlüssel‑Technologien
  • Cloudflare Vectorize (hostete Vektor‑Datenbank)
  • Cloudflare Workers AI (Embedding‑Model, z. B. @cf/baai/bge-base-en-v1.5)
  • PartyKit (framework‑unabhängige Backend‑Plattform, Web‑Socket‑Support, API‑Routing)
• Deployment & Betrieb
  • Lokale Entwicklung mit npm run dev, Zugriff auf /admin?key=….
  • Produktions‑Hosting über PartyKit (z. B. braggoscope-search.genmon.partykit.dev).
  • Vollständiger Code verfügbar auf GitHub (genmon/braggoscope-search).
• Ergebnis
  • Der Such‑Engine liefert semantische Treffer wie „Jupiter“ oder „größte Planet“, selbst bei nicht exakt passenden Suchbegriffen.
  • Bauzeit: ca. 160 Zeilen PHP/TS, minimale Boilerplate, keine eigene Datenbank- oder ML‑Infrastruktur nötig.

Related queries

• Wie können Embeddings in PartyKit integriert werden?
• Welche Vorteile bietet Cloudflare Vectorize gegenüber klassischen Datenbanken?
• Wie erstelle ich einen Secret‑Key für die Admin‑UI eines PartyKit‑Projekts?

Quelle: https://blog.partykit.io/posts/using-vectorize-to-build-search/