Watch the machinery move.
Some things are easier to learn by seeing them happen. A CPU cycling. A packet on a wire. Bytes flowing through a database. 35 step-driven walkthroughs across six families, each one pausing for you, defining its terms inline, and ending with a link to the Codex chapter for the deeper read. Five of them — from how a computer runs a program through source-to-machine — are also the spine of the apprenticeship's machine task, four weeks of losing the magic.
Also available Simulators → 49 interactive playgrounds where you turn the knobs yourself. /visualize is "watch"; /simulators is "play."Hardware & memory
How the silicon actually does its job.
The machine underneath your runtime. Cycles, caches, page tables, register files. The stuff that decides whether your tight loop takes a nanosecond or a millisecond per iteration.
How a computer runs a program
The whole machine end to end — disk, RAM, the cache hierarchy, CPU, syscall, display. Every cycle counted.
OpenHow memory actually works
Same array, sum twice — random then sequential. Sequential ends ~30× faster. Watch the cache lines pay it off.
OpenFunction calls and the call stack
Stack frames push and pop. Arguments, return address, locals. The mental model recursion needs.
OpenStack vs heap memory
Where does that variable live? Why does free() exist on one side and not the other? The address-space picture.
OpenCPU pipelining
Five-stage pipeline, three instructions in flight at once. Then a RAW hazard saved by forwarding. Then a branch misprediction.
OpenVirtual memory and the TLB
Page-table walk, TLB hit, page fault. Why one access can take 10 ms when things go wrong.
OpenContext switching
Timer fires, kernel saves registers, picks next process, loads its registers, returns. Plus the cache cost nobody talks about.
OpenHow threads work
Three threads sharing a counter. Watch a race condition lose two updates, then watch a mutex fix it.
OpenCode & languages
What source code becomes — at every layer of translation.
From the file you typed into the bytes the CPU executes. Preprocessor, parser, IR, optimizer, codegen, linker, loader. Six tools, five intermediate files, one running program.
How code becomes machine code
Source → preprocessor → assembly → object file → linker → executable. One function, every stage previewed.
OpenLexer → Parser → AST → Compiler
An expression chewed through five stacked stages. Tokens, an actual tree, IR, machine code.
OpenJIT compilation
Hot loop accumulates counters. JIT triggers. Same code now runs ~100× faster. Then a deopt.
OpenClosures and scope
Inner function captures outer variable. The captured environment goes with it. Why the for-var-setTimeout gotcha bites.
OpenJavaScript event loop
Call stack, microtask queue, macrotask queue. Why setTimeout(0) doesn't mean "now."
OpenGarbage collector
Heap visualised as an object graph. Mark, sweep, compact. Gen-0 fast, full-GC slow.
OpenNetworking
Packets, protocols, and what actually travels the wire.
The protocols that shuttle bytes between machines. Handshakes, congestion control, the medium underneath. The reason your request that "should be fast" is sometimes 300 ms.
A TCP connection, packet by packet
SYN, SYN-ACK, ACK, payload, FIN, ACK, FIN, ACK. Both state machines visible. Every header field labelled.
OpenA web request, end to end
Browser → DNS → TCP → TLS → HTTP → server → response → render. ~370 ms accounted for.
OpenTCP congestion control
cwnd over time. Slow start, congestion avoidance, packet loss, fast retransmit, the sawtooth.
OpenHow WiFi works
Beacon, probe, authenticate, associate, send. CSMA/CA backoff. Collisions when two clients pick the same slot.
OpenData & databases
What happens between INSERT and "OK", and what survives the crash.
How data structures and storage engines actually do their work. The page splits, the bit arrays, the queue depth math that turns calm services into pile-ups.
How a database writes a row
Buffer pool, WAL append, fsync, ACK, checkpoint. The fsync moment that costs more than all the rest.
OpenA B-tree insert and split
Order-4 tree, keys inserted one at a time. When the leaf overflows, watch the split propagate up.
OpenBloom filter — adds, queries, false positives
Bit array of size m. Insertions set bits. Queries match or false-positive. Live FP rate vs theoretical.
OpenA queueing system under load
Little's Law live. Set λ and W, watch the queue depth and wait time. The "knee" appears at ρ→1.
OpenDistributed & infra
Many machines pretending to be one.
Where the abstraction of "one big computer" gets implemented from many small ones. Consensus, partitioning, scheduling, the routing rules that make a cluster behave like a cluster.
Raft leader election + replication
5 nodes, one fails, election timeout fires, new leader emerges. Then a write replicates.
OpenPaxos rounds
Prepare → promise → accept → accepted → decide. Two proposers race; the chosen value sticks.
OpenConsistent hashing
Ring with N nodes. Add and remove nodes. Keys re-map; counter shows moved keys vs naive modulo.
OpenKubernetes scheduler
A new pod arrives. Five candidate nodes. Filter → score → bind. Watch the filtering reasons.
OpenService discovery flow
New pod → kubelet → API server → etcd → endpoints controller → kube-proxy → iptables. End: a request lands.
OpenAPI Gateway request lifecycle
TLS → auth → rate limit → route → transform → upstream → transform → emit metrics → respond.
OpenDocker networking
Network namespaces, veth pairs, the docker0 bridge, and the iptables NAT rules that actually route container traffic.
OpenBig real-world systems
Things people use every day, opened up.
End-to-end stories of products you touch daily. The pipeline that turns HTML into pixels, the index that answers your search query, the trick that makes a video file 90% smaller.
Browser rendering pipeline
HTML+CSS+JS arrives. Parse → DOM → CSSOM → render tree → layout → paint → composite. Watch layout thrash.
OpenHow search engines crawl and index
URL frontier, fetcher workers, tokenizer, inverted index. Then a live query against the index.
OpenHow recommendation systems work
User-item matrix factorised into two narrow latent matrices. New user enters; their vector predicts ratings.
OpenHow YouTube streams a video
Manifest, segments, adaptive bitrate. Drag the bandwidth slider; watch the player adapt.
OpenHow video compression works
I-frames, P-frames, B-frames. 24 frames in a row; per-frame byte size; the 5× difference if every frame is I.
OpenHow QR codes work
Encode "HI" into modules. Reed-Solomon adds error correction. Scratch 12 modules; watch the decoder recover.
OpenRun the simulators
49 interactive playgrounds where you turn the knobs. Raft, CAP, sharding, caching, sorting, container layers. Browser-only, no install.
Browse simulatorsThe Codex
Long-form deep dives for every concept the visualizations touch. Computer architecture, networking, databases, distributed systems, operating systems, languages.
Open the CodexThe roadmap
The 15-stage backend engineer path. Every topic linked to a deep dive, simulator, or visualization. The "what to learn next" map.
Open the roadmap