OVERVIEW
A real-time data pipeline that ingests a 24/7 live video stream, runs scheduled computer vision inference, embeds scene descriptions into vector storage, and synchronizes AI-generated dialogue to all connected clients via WebSockets — all orchestrated on Cloudflare's global edge network.
USER EXPERIENCE
- PRESS PLAY: A Cloudflare Stream embed (HLS/DASH) delivers a resilient, device‑friendly live feed.
- SOUNDTRACK: A time‑based rotation selects tracks for sunrise, sunset, and top‑of‑hour moments. In production, audio is delivered via per‑request signed URLs from R2; local dev seamlessly falls back to a proxy stream.
- OSCILLOSCOPE: A full‑screen 4×4 waveform grid renders the soundtrack in realtime. Switch among oscilloscope, bars, radial, and area modes—always behind the UI, always crisp.
- LIVE COMMENTARY: Two contrasting LLM personas provide synchronized, line‑by‑line commentary over WebSockets. Everyone hears the same "show" in the same moment.
- CHANNELS: Pick a topic channel to change tone and subject; the system hot‑starts the conversation with the latest scene.
HOW IT WORKS
- EDGE APP: A single Cloudflare Worker handles routes, directory normalization, and static
delivery via
env.ASSETS, with CSP and security headers applied. - SCHEDULED CAPTIONS: Every few minutes, a cron Worker grabs a thumbnail from Stream, describes the scene with Workers AI (Vision), and stores the snapshot in R2.
- EMBEDDINGS & EVENTS: Scene text is embedded with @cf/baai/bge‑small‑en‑v1.5 and indexed in Vectorize. A structured "strange event" record lands in D1 for analytics and search.
- GLOBAL DIALOGUE: A Durable Object (global instance) turns the latest scene into a two‑line debate and broadcasts it to all visitors via WebSockets, with budget/cadence controls to keep costs predictable.
- AUDIO DELIVERY: The soundtrack endpoint chooses a track using SunCalc heuristics (sunrise/sunset, even/odd hour) and returns a signed URL (prod) or dev proxy—no UI changes required.
- MEDIA PIPELINE: Private objects stream with Range (206), ETag/Last‑Modified, and immutable caching; filenames are allowlisted to block traversal.
WHAT MAKES IT DIFFERENT
- Edge‑Native, Zero‑Ops: All delivery, logic, AI, and storage run on Cloudflare's edge—low‑latency and low‑maintenance.
- Synchronized Personas: Commentary is global and consistent—one Durable Object, one conversation, shared by everyone.
- Prompt Discipline: Persona prompts are strictly constrained (including the recurring clause "the fundamental datum is") and sanitized before broadcast to preserve tone and safety.
- Time‑Aware Sound: Sunrise/sunset and hourly events subtly change the score so the site "breathes" throughout the day.
- Robust Media: Signed URLs in production, dev fallbacks, and immutable caching policies make private media fast and reliable.
MY DESIGN APPROACH
- System architecture, data flow design, and infrastructure planning
- Distributed systems engineering (Workers, Durable Objects, Vectorize, D1), media delivery, and security headers
- Frontend (vanilla JS), real‑time visualizer, and commentary client UX (typewriter, channel switching)
- AI/ML pipeline engineering: scheduled inference, embedding generation, cost/budget controls, and output sanitization
- Event storage and semantic search via vector embeddings and structured event taxonomy
OUTCOME
A production-grade, always‑on distributed system demonstrating edge compute patterns, AI orchestration, and event-driven architecture. The system is extensible (new inference models, richer event taxonomy, expanded state coordination) while remaining zero-ops through Cloudflare's serverless infrastructure.
TECH STACK
- Cloudflare: Workers, Durable Objects, Stream, R2, Workers AI, Vectorize, D1
- Frontend: Vanilla JS (commentary client, carousel, badges), Canvas‑based 4×4 visualizer
- AI Models: Vision (LLaVA‑1.5 family), @cf/baai/bge‑small‑en‑v1.5 embeddings, LLM for dialogue
- Scheduling: Cron Worker for snapshot → caption → embedding → DO trigger
- Media: Range (206), ETag/Last‑Modified, immutable caching, allowlisted filenames
- Utilities: SunCalc for sunrise/sunset and top‑of‑hour logic; Wrangler for dev/deploy