Question in use: How much is a boat ticket?. Best passage: Ferry timetable, part 1, cosine 0.357.
How a search finds the right page by meaning
Keyword search finds the words you typed. But a question about a “boat ticket” should find a page about a ferry fare, and they share no words. Vector search fixes this: a model turns each text into a list of numbers that stands for its meaning, and the search looks for the closest lists. You will see how closeness is measured, why checking every passage gets too slow for big collections, and how faster approximate searches trade a little accuracy for speed. Every number is shown.
Try this first
- Open “Read the 32 passages” below. They describe a made-up island, Fernport, cut into short pieces.
- In Meaning as numbers, press “How much is a boat ticket?” and look at the 8 numbers for the question and for the best passage.
- In Cosine similarity, check the worked example by hand: 3×4 + 4×3 = 24, then 24 ÷ (5 × 5).
- In Exact search, see that the ferry passage ranks first, though the question never uses its words.
- In Approximate search, press “Is there food for sale on the weekend?”, set nprobe to 1, then raise it until the result matches exact search.
- In The vector store, press “Save the vectors”, reload the page, and see them come back.
- In Compare, see BM25 find nothing for the boat question while vector search finds the ferry.
Read the 32 passages
Fernport is a made-up island. Its 10 documents are cut into 32 passages of 2 sentences each, and each passage has a ready-made list of 384 numbers.
- Fernport Bakery
- Fernport Bakery stands on Harbour Street. It is run by Mira Okafor.
- Fernport Bakery
- Mira is famous for her dark rye bread, baked only on Tuesdays. She learned to bake from Tomas Reyes when she was sixteen.
- Fernport Bakery
- The shop opens at 7 in the morning and closes when the bread is gone.
- Fernport Lighthouse
- The Fernport Lighthouse was built in 1891 on the north cliff. Its lamp can be seen 30 kilometres out at sea.
- Fernport Lighthouse
- Guided tours run on Saturdays and Sundays at 10:00 and 14:00. The guide is Tomas Reyes, who has climbed the lighthouse’s 120 stairs every week for 20 years.
- Fernport Lighthouse
- The lighthouse is closed in January for repairs.
- Ferry timetable
- The ferry crosses from Millbay on the mainland to Fernport in 40 minutes. A ferry fare costs 6 coins, and children ride free.
- Ferry timetable
- Bikes travel for 1 coin more. December to February is the quiet season.
- Ferry timetable
- Then there is only one crossing a day, at 10:00 from Millbay. The rest of the year, the ferry leaves Millbay at 8:00, 12:00 and 17:00.
- Lantern Festival
- The Lantern Festival lights up Fernport every October. People hang paper lanterns along Harbour Street for a week.
- Lantern Festival
- On the last night of the festival, everyone walks to the north cliff to watch the lighthouse lamp switch on.
- Visitor rules
- Visitors may camp only at the campsite behind the school. Fires are allowed on the beach, but never in the woods.
- Visitor rules
- Dogs must stay on a lead near the harbour.
- Harbour guide
- The Fernport harbour is the busiest place in town. The harbour has a long stone wall, and the harbour wall keeps the water calm inside.
- Harbour guide
- Fishers bring their catch to the harbour at dawn, and the harbour market sells it fresh by seven. Every morning the harbour fills with gulls, nets and carts.
- Harbour guide
- The ferry from the mainland ties up at the harbour, at the far end of the east pier. A small harbour office hands out maps and answers questions.
- Harbour guide
- The harbour café serves hot soup to anyone who is cold. Walk along the harbour edge at sunset to see the water turn orange.
- Harbour guide
- At night the harbour is lit by a row of yellow lamps, and the harbour is quiet. The harbour crane lifts crates of apples, wool and salt from the quay onto carts.
- Harbour guide
- Young children feed the gulls near the harbour steps, while old fishers mend their nets and trade stories about the weather. Two painted sheds beside the harbour store ropes, buoys and lamps.
- Harbour guide
- A harbour bell rings at noon, and again when the tide turns. Anyone who loves the sea should spend a slow afternoon at the harbour.
- Fernport School
- Fernport School teaches about forty children, from age five to twelve. Classes start at 9 in the morning and end at 3.
- Fernport School
- Every child learns to swim in the sea pool, and older children learn to sail. The school library is open to the whole town on Wednesdays.
- Fernport School
- The school choir sings at the end of every term.
- Saturday market
- The Saturday market fills the square beside the town hall. Farmers sell apples, honey and goat cheese.
- Saturday market
- Weavers sell wool scarves and hats. A woman named Ida Lund sells smoked fish from a blue stall.
- Saturday market
- The market opens at 8 in the morning and packs up at noon.
- Weather and seasons
- Fernport is mild and damp. Summer days reach about 22 degrees, and the sea is warm enough to swim in July and August.
- Weather and seasons
- Autumn brings strong winds from the west. Fog often covers the cliffs in the early morning.
- Weather and seasons
- It snows only once or twice a year, and the snow melts by noon.
- History of Fernport
- Fernport began as a fishing village about 400 years ago. The first stone houses were built in 1650, from rock taken from the cliffs.
- History of Fernport
- A great storm in 1702 washed away the old pier, and the town built a new one. In 1950 a bridge was planned, but the islanders voted against it.
- History of Fernport
- Today about 900 people live in Fernport.
Chapter 1: Meaning as numbers: the embedding
Question in use: How much is a boat ticket?
Keyword search compares words. Vector search compares meaning. An embedding model reads a piece of text and writes its meaning as a long list of numbers, called a vector. This model writes 384 numbers for every text, and each position in the list is a dimension. The 32 passages about the island of Fernport already have their lists, made once in advance. Texts with close meanings get close lists, even when they share no words. The table shows only the first 8 of the 384 numbers, so you cannot see the whole pattern, but you can see that the lists are not random.
Press “How much is a boat ticket?” and compare the question’s 8 numbers with the best passage and the worst passage. The cosine column says how close each list is to the question’s list, and the next chapter shows how it is worked out.
The question has 384 numbers. Best passage: Ferry timetable, cosine 0.357. Worst passage: Weather and seasons, cosine -0.078.
Scroll sideways to see every column.
| Text | Number 1 | Number 2 | Number 3 | Number 4 | Number 5 | Number 6 | Number 7 | Number 8 | Cosine with the question |
|---|---|---|---|---|---|---|---|---|---|
| Your question: How much is a boat ticket? | 0.018 | 0.067 | -0.036 | 0.001 | 0.001 | -0.035 | 0.015 | 0.076 | not applicable |
| Best passage: Ferry timetable | 0.063 | -0.016 | 0.054 | -0.022 | 0.046 | 0.041 | 0.022 | 0.050 | 0.357 |
| Worst passage: Weather and seasons | -0.042 | 0.050 | 0.155 | 0.035 | -0.025 | -0.023 | -0.036 | 0.010 | -0.078 |
Each list has 384 numbers in all. Only the first 8 are shown.
Chapter 2: Cosine similarity: how close are two lists?
Question in use: How much is a boat ticket?
To say how close two lists are, multiply them position by position, add the products up (the dot product), then divide by the length of each list. The result is the cosine similarity: 1 means the same direction, 0 means unrelated, and negative means opposite. Here is a worked example with 2 numbers instead of 384. List A is (3, 4) and list B is (4, 3). The dot product is 3×4 + 4×3 = 24. Each list has length 5, because the square root of 3×3 + 4×4 is 5. So the cosine is 24 ÷ (5 × 5) = 0.96. The embeddings here are scaled to length 1 (normalised), so the division is by 1 × 1 and the cosine is simply the dot product.
Press “How much is a boat ticket?” and read the two ways of getting the same score for the best passage: the dot product, and the full cosine. They match.
Best passage Ferry timetable. Dot product 0.357, cosine 0.357.
- Best passage for your question
- Ferry timetable
- Length of each list
- 1.000 and 1.000
- Dot product (all 384 products added up)
- 0.357
- Cosine similarity (dot product ÷ both lengths)
- 0.357
Both lengths are 1, so the dot product and the cosine are the same number.
Chapter 3: Exact search: compare with every passage
Question in use: How much is a boat ticket?
The simplest vector search is brute force: work out the cosine between the question and every stored passage, then sort. It always finds the true nearest neighbours, the passages closest in meaning. Its cost is one comparison per passage, so 32 passages cost 32 comparisons. A search engine with a billion passages cannot afford that for every question, which is why the next chapter exists.
Press “How much is a boat ticket?”. The ferry fare ranks first, though the question never says “ferry” or “fare”. The count of comparisons is always the number of passages.
Compared with all 32 passages. Top result: Ferry timetable.
Comparisons made: 32 (one for each of the 32 passages).
- Ferry timetable cosine 0.357
The ferry crosses from Millbay on the mainland to Fernport in 40 minutes. A ferry fare costs 6 coins, and children ride free. - Ferry timetable cosine 0.326
Then there is only one crossing a day, at 10:00 from Millbay. The rest of the year, the ferry leaves Millbay at 8:00, 12:00 and 17:00. - Harbour guide cosine 0.268
Fishers bring their catch to the harbour at dawn, and the harbour market sells it fresh by seven. Every morning the harbour fills with gulls, nets and carts. - Harbour guide cosine 0.220
A harbour bell rings at noon, and again when the tide turns. Anyone who loves the sea should spend a slow afternoon at the harbour. - Harbour guide cosine 0.214
The ferry from the mainland ties up at the harbour, at the far end of the east pier. A small harbour office hands out maps and answers questions.
Chapter 4: Approximate search: look at fewer passages
Question in use: How much is a boat ticket?
Approximate search skips most passages and accepts that it may miss the best one. IVF (inverted file index) first sorts the passages into 6 clusters, groups of similar passages, each with a centroid, the average of its members. A question is compared with the 6 centroids, then only with the passages in the nprobe closest clusters. A small nprobe is fast and may miss; nprobe 6 looks in every cluster. Graph search links each passage to its 8 nearest neighbours, then walks from a starting passage, always stepping to the best unvisited passage it has seen, until nothing better is left. Real systems such as HNSW (hierarchical navigable small world) stack several graph layers: the top layer has few passages and long jumps to get close quickly, and each lower layer has more passages and shorter steps to zoom in. This lab uses one layer. Notice that with only 32 passages, approximate search barely saves anything; it pays off when there are millions.
With nprobe 1, press “Is there food for sale on the weekend?”: IVF looks at one cluster and the true best passage is not in it. Raise nprobe until it is found. At nprobe 6 IVF compares more than 32 things, because it compares the 6 centroids first and then every passage. Press “Where can I sleep in a tent?” to see the graph walk miss the best passage.
Exact search: 32 comparisons. IVF with nprobe 1: 14 comparisons, same top result as exact search. Graph search: 21 comparisons, same top result as exact search.
IVF: look inside the closest clusters
The passages are sorted into 6 clusters of 10, 1, 3, 8, 4, 6 passages. Each cluster is named after its first passage. Closest clusters to your question, nearest first: “Ferry timetable, part 1”.
Comparisons made: 14 = 6 centroids + 8 passages in the clusters looked inside. Exact search made 32.
Same top result as exact search: Ferry timetable.
- Ferry timetable cosine 0.357
The ferry crosses from Millbay on the mainland to Fernport in 40 minutes. A ferry fare costs 6 coins, and children ride free. - Harbour guide cosine 0.214
The ferry from the mainland ties up at the harbour, at the far end of the east pier. A small harbour office hands out maps and answers questions. - History of Fernport cosine 0.205
A great storm in 1702 washed away the old pier, and the town built a new one. In 1950 a bridge was planned, but the islanders voted against it.
Graph search: walk along the links
Each passage is linked to its 8 nearest neighbours. The walk visited these passages in order: Fernport Bakery, part 1 → Ferry timetable, part 1 → Ferry timetable, part 3 → Harbour guide, part 2.
Comparisons made: 21 (every passage it looked at). Exact search made 32.
Same top result as exact search: Ferry timetable.
- Ferry timetable cosine 0.357
The ferry crosses from Millbay on the mainland to Fernport in 40 minutes. A ferry fare costs 6 coins, and children ride free. - Ferry timetable cosine 0.326
Then there is only one crossing a day, at 10:00 from Millbay. The rest of the year, the ferry leaves Millbay at 8:00, 12:00 and 17:00. - Harbour guide cosine 0.268
Fishers bring their catch to the harbour at dawn, and the harbour market sells it fresh by seven. Every morning the harbour fills with gulls, nets and carts.
Chapter 5: The vector store: keep the numbers
Making embeddings is the slow part, so real systems make them once and keep them in a vector database: a database built to store vectors and find the nearest ones fast. Here the store is smaller. Your browser has a built-in database called IndexedDB, and the buttons below save the 32 vectors there. The data stays on this device, and nothing is sent anywhere. Some browsers block it (for example in a private window), and then the lab says so and carries on without saving. The saved copy is only a demonstration: the searches in this lab always use the vectors that come with the page.
Press “Save the vectors”, reload the page, and see the message “Loaded 32 vectors from this browser.” Press “Clear” to remove them.
The store holds 32 vectors of 384 numbers each.
Looking for saved vectors…
Chapter 6: Compare: meaning vs words vs spelling
Question in use: How much is a boat ticket?
The same question goes through three searches. Vector search compares meaning. BM25 (from Lab 06) scores the words that the documents and the question share. Fuzzy search (from Lab 07) forgives spelling mistakes, but it still compares letters, not meaning, so it cannot link “boat ticket” to a ferry fare. BM25 and fuzzy search find whole documents, vector search finds passages (a document is cut into passages of 2 sentences), so each result below is shown as a document title.
Press “How much is a boat ticket?”: BM25 finds no document, because no document uses the words “boat” or “ticket”, yet vector search finds the ferry. Then press “What happens in autumn?”, where words and meaning agree.
Vector search: 2 documents, first Ferry timetable. BM25: no document. Fuzzy search: 4 documents.
Vector search
Closeness of meaning.
- Ferry timetable
- Harbour guide
BM25
Shared words.
No document uses these words.
Fuzzy search
Words within 2 letter changes, so it matches spelling, not meaning.
- Ferry timetable
- Visitor rules
- Harbour guide
Word list
- Embedding
- A piece of text turned into a list of numbers that stands for its meaning. Texts with similar meanings get similar lists.
- Vector
- A list of numbers. An embedding is a vector.
- Dimension
- One position in a vector. This lab’s vectors have 384 dimensions, so 384 numbers.
- Embedding model
- The AI model that reads text and writes its embedding. This lab uses a small one called all-MiniLM-L6-v2, about 23 MB.
- Cosine similarity
- How close two vectors point: 1 means the same direction, 0 means unrelated. It is the dot product divided by both lengths.
- Dot product
- Multiply two vectors position by position and add the results. (3, 4) and (4, 3) give 3×4 + 4×3 = 24.
- Unit length (normalise)
- Scaling a vector so its length is exactly 1. For two such vectors the cosine similarity equals the dot product.
- Nearest neighbour
- The stored vector closest to the question’s vector, which means the passage closest in meaning.
- Brute force
- Comparing the question with every stored vector. Always exact, but the work grows with the number of vectors.
- Approximate search
- Search that looks at only some vectors to save work. It is faster, but it may miss the true best result.
- Index
- A structure built ahead of time so that searching is faster than looking at everything.
- IVF
- Inverted file index: sort the vectors into clusters first, then search only the closest few clusters.
- Cluster
- A group of vectors that are close to each other.
- Centroid
- The average of all the vectors in a cluster. It stands for the cluster when a question is compared with the clusters.
- nprobe
- How many of the closest clusters IVF looks inside. A bigger nprobe finds more, and compares more.
- Graph search
- Link each vector to its nearest neighbours, then walk along the links toward the question, always to the best unvisited vector seen so far.
- HNSW
- Hierarchical navigable small world: graph search with several layers. Top layers hold few vectors and make long jumps, lower layers hold more and make short steps.
- Layer
- One level of an HNSW graph. This lab uses a single layer.
- Recall
- The share of the true best results that a search found. Exact search has recall 1.
- Vector store
- A place that keeps vectors so they do not have to be made again. Here, your browser’s IndexedDB.
- Vector database
- A database made to store vectors and find the nearest ones quickly, often with an index such as IVF or HNSW.
- IndexedDB
- A database built into your browser. It keeps data on this device between visits.
- Passage
- A short piece of a document. Here every document is cut into passages of 2 sentences, and each passage gets its own vector.
- Comparison
- One check of the question against one vector (or one cluster centre). Fewer comparisons means a faster search.
- BM25
- A keyword search from Lab 06 that scores the words a document and the question share, giving more weight to rare words.
- Fuzzy search
- A search from Lab 07 that forgives spelling mistakes by comparing letters, not meaning.
- WASM
- WebAssembly: a way to run fast code in the browser on the CPU. The embedding model uses it when you ask your own question.
- Semantic search
- Search by meaning instead of by matching words.