Visualizers

Learn by moving things

Interactive explainers for the ideas behind retrieval, embeddings, and agents. A formula tells you what is true; dragging a vector shows you why. Each one also appears inside the article it belongs to, and runs entirely in your browser, so drag, poke, and break it.

Portrait of Sachin Gupta rendered in binary

Reciprocal Rank Fusion

From: Hybrid Search

How hybrid search merges a keyword list and a vector list into one. Watch two ranked results fuse by summing 1/(k + rank), with the math shown per document, and drag the rank constant to reshape the blend.

Query: “reset my password”
Keyword (BM25)
matches literal terms
  1. 1Reset your password
  2. 2Password reset email issues
  3. 3Change password in settings
  4. 4Forgot your username
  5. 5Cannot sign in
Semantic (vector)
matches meaning
  1. 1Recover a locked account
  2. 2Reset your password
  3. 3Cannot sign in
  4. 4Change password in settings
  5. 5Password reset email issues
Fused (RRF)
score = 1/(k+rank) summed
  1. 1Reset your password0.0325
    K#1 V#2
  2. 2Password reset email issues0.0315
    K#2 V#5
  3. 3Change password in settings0.0315
    K#3 V#4
  4. 4Cannot sign in0.0313
    K#5 V#3
  5. 5Recover a locked account0.0164
    K— V#1
  6. 6Forgot your username0.0156
    K#4 V—
A document ranked high in either list scores well; ranked high in both, it wins. No score normalization, just ranks. Larger k flattens the gap between ranks.

Before retrieval can work, a document is cut into passages. Drag chunk size and overlap and watch the tradeoff: small chunks are sharp but lose context, big ones blur topics, and overlap keeps a thought from being cut at the seam.

6 chunks
chunk 1

A vector database stores embeddings and finds the nearest ones to a query. Before anything can be stored,

chunk 2

anything can be stored, the source documents must be split into smaller passages called chunks. Each chunk becomes

chunk 3

chunks. Each chunk becomes a single vector. If a chunk is too large it mixes several topics and

chunk 4

mixes several topics and its vector turns blurry. If it is too small it loses the surrounding context

chunk 5

loses the surrounding context that made it meaningful. Overlap keeps a sentence from being cut in half at

chunk 6

cut in half at a boundary.

Smaller chunks are sharper but more numerous and lose context; larger chunks keep context but blur topics together. The greyed words are overlap, shared with the previous chunk so a thought is not cut at the seam.

The naive RAG pipeline

From: A Field Guide to RAG

Step through the four stages every RAG system runs: take the question, retrieve the relevant passages, put them in the prompt, and answer from them. A company-HR example makes each stage concrete.

0 / 4 stages
1 · Question
2 · Retrieve
3 · Augment
4 · Generate
Retrieve the relevant passages, put them in the prompt, answer from them. The model never memorized the vacation policy; it read it at question time.
Visualizers — Sachin Gupta