Reference · print-friendly

Cache Storage decision playbook

One page for design reviews. Walk top to bottom; stop when a row rejects the current candidate.

← Lesson 5 Integration checklist Strategies Glossary

1. Gate A · Job (which store?)

If…	Prefer…
Re-fetch is cheap; no offline need	Memory only (skip durable client store)
Tiny string flags	sessionStorage / localStorage (sparingly)
HTTP assets / app shell / resource responses	Cache Storage (+ usually a service worker)
Durable structured app data (drafts, entities)	IndexedDB
File-shaped editor pipelines	OPFS
Must-be-live money / auth actions	Network only — honest offline failure

2. Gate B · Warehouse shape (if Cache Storage)

Named caches encode version: static-v3, pages-v2
Only Request/Response pairs — open → add/put → match
add/addAll = fetch + 200-range only; put = you supply Response (more permissive)
Match is not path-only (query, method, Vary) — loosen with options when intentional
caches.delete(name) drops a whole generation; cache.delete(req) one entry

3. Gate C · Policy (service worker)

install — precache must-have shell with waitUntil(addAll)
activate — delete old named caches (keep lean)
fetch — strategy by URL class:
- Versioned shell / static → cache, falling back to network
- Prefer fresh, stale OK offline → network, falling back to cache
- Fast now, fresher later → stale-while-revalidate
- Payments / analytics → network only
- Known precache only → cache only
Warehouse ≠ policy: Cache Storage stores; SW decides when to fill/serve

4. Gate D · Ship risks

Nothing auto-expires — own versioning + cleanup
Opaque / no-CORS: add fails; put is a tradeoff
HTTP cache layer can “win” under SW revalidate — design headers too
Quota shared with IDB; catch QuotaExceededError; bound runtime caches
Best-effort eviction; Safari script-writable caps — re-fetch path required
response.clone() when both putting and returning

5. Sentence template

“We use Cache Storage | IndexedDB | memory | … because job; warehouse is named versions + put/match shape; policy is install/activate + strategy per route; we own one risk (cleanup / opaque / dual-cache / quota).”