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.
API: just two operations
From: How to Design a System →Step three. The whole contract is two calls, like a vending machine: create takes a long URL and returns a short one; visit takes the short one and returns a redirect.
The whole contract is two calls: one to make a short link, one to follow a short link. Pin this down before designing the insides.
Data model: a coat check
From: How to Design a System →Step four. Hand over the short code (the ticket), get back the long URL (the coat). Because you only look up by the code, a key-value store fits.
You only ever look up by the short code, so a simple key-value store beats a complex relational table.
High-level design: a request's path
From: How to Design a System →Step five. Follow a request through the boxes: user, load balancer, server, cache hit, then a redirect straight back. The boxes-and-arrows step.
Boxes and arrows: the request goes user, load balancer, server, cache, then straight back. The cache hit is why it feels instant.