Part III — The Speed

6 Database & Caching

GoalDecide what to store, where to store it, and how long it stays valid.

6.1 Database & Caching Overview The browser has five storage tiers — pick by size, lifetime, and who else needs to read it. Storage tier stack with size, lifetime, and access cost · 14 min
6.2 Local Storage Five megabytes of persistent strings, read and written synchronously on the main thread. Key-value box with limits and the sync-blocking cost · 12 min
6.3 Session Storage Same API as localStorage, but the data dies when the tab does — and never leaves that tab. Tab lifetime and isolation boundaries · 11 min
6.4 Cookie Storage Four kilobytes that ride along on every single request — which is both the feature and the cost. Request carrying cookies + the attribute matrix · 14 min
6.5 Indexed DB An asynchronous, transactional, indexed store for hundreds of megabytes of structured data. Object store schema with indexes + async transaction flow · 16 min
6.6 Normalization Store every entity once, by id, and reference it everywhere else — duplicates are bugs waiting to happen. Nested vs normalized shape, and the update that breaks one of them · 15 min
6.7 HTTP Caching Two headers decide whether a request happens at all, and whether it costs a full download. Cache decision flowchart + fresh vs revalidate · 17 min
6.8 Service Worker Caching A programmable proxy inside the browser — you write the cache policy in JavaScript. Intercept flow + the five caching strategies · 17 min
6.9 API Caching Cache responses by key in the client, then decide the one hard thing: when they stop being true. Cache key lifecycle + invalidation triggers · 16 min
6.1 State Management Sort state by who owns it — server, URL, or client — and most of the hard problem disappears. State ownership map + the scope ladder · 17 min

Capstone

Design the full caching strategy for a news feed that must open instantly, work offline, and never show a deleted article.