โš™๏ธ Technical Overview

How SmartMovieSearch works

A production multi-agent AI system combining real-time movie data, vector search, and web retrieval into a single streaming answer.

smartmoviesearch.com ยท github.com/worldwidejimmy/pipeline ยท LangGraph ยท Milvus ยท Groq ยท React

01 The Problem

Ask a movie database "Show me good bank heist movies" and it returns nothing โ€” heist is a theme, not a genre tag. Ask it "Is Project Hail Mary Ryan Gosling's best work?" and it has no way to answer. These questions require reasoning, not filtering.

Movie databases like TMDB are exhaustive but rigid. They expose genre filters, release years, and ratings โ€” but they cannot interpret themes, compare filmographies, or synthesise critical perspective. A single LLM call lacks live data. A single API lacks semantic understanding. The only viable solution is decomposition: multiple specialised agents working in parallel, coordinated by an orchestrator.

02 System Architecture

User (browser)
    โ”‚  HTTPS โ€” Cloudflare CDN + SSL termination
    โ”‚
Nginx  (reverse proxy, OVH VPS)
    โ”œโ”€โ”€ /         โ†’ React frontend  (static, port 5174)
    โ””โ”€โ”€ /api/*    โ†’ FastAPI backend (uvicorn,  port 8001)
                      โ”‚
                      โ”‚  Server-Sent Events stream
                      โ”‚
              LangGraph StateGraph
                      โ”‚
          โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”ดโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”
          โ”‚    supervisor_route    โ”‚  โ† decides which agents to invoke
          โ””โ”€โ”€โ”ฌโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”ฌโ”€โ”€โ”€โ”€โ”€โ”€โ”ฌโ”€โ”€โ”€โ”˜
             โ”‚          โ”‚      โ”‚     (parallel fan-out)
       tmdb_agent   rag_agent   search_agent
       TMDB API      Milvus      Tavily Web
       (httpx)       :19530      API
             โ”‚          โ”‚      โ”‚
          โ””โ”€โ”€โ”ดโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”ดโ”€โ”€โ”€โ”€โ”€โ”€โ”ดโ”€โ”€โ”€โ”˜
                      โ”‚
               synthesise          โ† merges results, streams answer
                      โ”‚
             SSE โ†’ browser (token by token)

Each layer has a single, clear responsibility. The supervisor decides routing. Agents specialise. The synthesiser integrates. The SSE stream makes the entire process visible to the user in real time.

03 Core Technologies

LangGraph โ€” Multi-Agent Orchestration

LangGraph models the AI pipeline as a directed graph. Each node is an async Python function (an agent); each edge is conditional routing logic. A shared StateGraph object carries conversation state between nodes, and MemorySaver checkpoints that state to disk so multi-turn conversation context persists across queries on the same thread.

Why not a single LLM call? A prompt cannot simultaneously call a live API, query a vector database, and do a web search. Agents decompose the problem so each specialist uses the right tool โ€” and they run in parallel, not sequentially.

Milvus โ€” Hybrid Vector Search

Milvus stores the movie knowledge corpus (critical essays, directorial analyses, genre guides). The RAG agent retrieves relevant passages using hybrid search: a fusion of two complementary retrieval methods ranked by Reciprocal Rank Fusion (RRF).

Dense
Embedding search
OpenAI text-embedding-3-small converts text to 1536-dim vectors. Finds semantically similar content even when exact words differ.
Sparse
BM25 keyword search
Exact keyword matching โ€” critical for proper nouns, film titles, and director names that embeddings can miss.
Fusion
RRF ranking
Reciprocal Rank Fusion merges both ranked lists into one. Gets the precision of BM25 and the recall of embeddings simultaneously.

Groq โ€” Fast LLM Inference

Groq runs llama-3.3-70b-versatile on custom LPU (Language Processing Unit) hardware, delivering roughly 10ร— the token throughput of comparable GPU cloud providers at a fraction of the cost. In a streaming UI where users watch tokens appear in real time, inference latency is the user experience โ€” this choice is why the first tokens arrive within ~1 second.

FastAPI + Server-Sent Events

The backend exposes a single streaming endpoint. It runs the LangGraph pipeline with astream_events() and translates internal events โ€” agent lifecycle, LLM tokens, retrieved chunks, TMDB results โ€” into a typed SSE stream consumed by the browser.

Why SSE over WebSockets? SSE is unidirectional (server โ†’ client), matching this use case exactly. It works through Cloudflare without configuration, and EventSource in the browser auto-reconnects on drop. WebSockets add bidirectional protocol overhead that is unnecessary here.

React + TypeScript Frontend

The frontend is a Vite SPA that maintains a live EventSource connection per query. It renders the pipeline in real time across four tabs: an animated pipeline graph (node status), a Gantt timeline (agent latency), a typed event log, and a context panel (retrieved chunks and TMDB cards). The AI process is visible, not a black box.

04 A Query, Step by Step

Tracing "Show me good bank heist movies" through the full stack:

1

Supervisor receives the question, calls Groq to classify intent โ†’ routes to all three agents in parallel: tmdb + rag + search

2

TMDB agent calls Groq to extract intent (discover, genre: Crime/Thriller) โ†’ queries TMDB API โ†’ calls Groq to write a grounded answer citing specific films with ratings

3

RAG agent embeds the query with OpenAI โ†’ runs hybrid BM25+dense search in Milvus โ†’ retrieves heist film corpus chunks โ†’ calls Groq to synthesise a knowledge-based answer

4

Search agent sends the query to Tavily โ†’ retrieves current web results โ†’ calls Groq to ground the answer in recent criticism and best-of lists

5

Synthesiser receives all three outputs, calls Groq to merge them into a single coherent answer โ€” deduplicating overlapping film mentions and attributing sources

6

SSE stream delivers typed events to the browser as they occur: pipeline_start โ†’ routing_decision โ†’ agent_start โ†’ token (ร—N) โ†’ tmdb_results โ†’ chunks_retrieved โ†’ agent_end โ†’ done

Total latency: typically 3โ€“6 seconds. First tokens appear within ~1 second of submitting. The parallel agent fan-out means all three agents run concurrently โ€” if they ran sequentially it would take 3ร— as long.

05 Technical Highlights

๐Ÿ”€
Hybrid retrieval (BM25 + dense, RRF fusion) Outperforms either method alone. BM25 catches exact name matches; embeddings catch semantic similarity. RRF merges both ranked lists without needing a learned combiner.
โšก
Parallel agent execution TMDB, RAG, and web search run concurrently via asyncio.gather. Each agent also parallelises its own internal fetches โ€” movie details and actor filmography are fetched simultaneously.
๐Ÿง 
Multi-turn conversation memory LangGraph's MemorySaver + thread_id gives the supervisor history across turns. "What about his other films?" works correctly without re-stating context.
๐Ÿ”ญ
Observable pipeline Every internal event โ€” agent start/end, LLM call, retrieved chunks, routing decision โ€” streams to the UI. The AI reasoning process is transparent, not a black box with a spinner.
๐ŸŽฌ
Filmography comparison intent A movie_and_person intent type fetches movie detail and actor filmography in parallel, sorts by rating, and hands the ranked list to the synthesis LLM โ€” turning "is this their best film?" from a non-answer into a precise ranked response.
๐Ÿš€
Production deployment Full Docker Compose stack on OVH VPS: Milvus + etcd + MinIO + FastAPI + React. Nginx reverse proxy. Cloudflare for SSL, CDN, and DDoS protection. Live at smartmoviesearch.com.

06 Full Stack Summary

Layer Technology Role
OrchestrationLangGraph 1.1Multi-agent state machine with conditional routing and conversation memory
LLM inferenceGroq (llama-3.3-70b)All reasoning: routing decisions, intent extraction, answer generation
Vector DBMilvus 2.5Hybrid BM25 + dense search over the movie knowledge corpus
EmbeddingsOpenAI text-embedding-3-small1536-dim dense vectors for semantic retrieval
Movie dataTMDB APIReal-time film/TV metadata, cast, ratings, trending, person filmography
Web searchTavily APICurrent web results as a third retrieval source
BackendFastAPI + uvicornAsync SSE streaming, typed event protocol
FrontendReact + TypeScript + ViteReal-time pipeline visualisation, conversation UI, dark/light theme
InfrastructureDocker Compose + Nginx + CloudflareContainerised deployment, reverse proxy, SSL termination, CDN