Lesson 0005 · ~12 minutes · synthesis

Ship the decision, not the buzzword

One skill: given a feature brief, write a complete caching choice — store, warehouse shape, serving strategy, and one risk you own.

← Lesson 4 Playbook (print) Checklist Glossary

Mission payoff

This is the durable skill from MISSION.md: defend a Cache Storage choice (or rejection) in a design review without hand-waving.

Lesson-only path

You can complete this from lessons 1–4 alone. External web.dev/MDN reads remain optional enrichment, not a gate.

1. The playbook (four gates)

Run in order. Earlier gates reject more options than later ones.

Gate A · Job

What must live on the client? Memory if re-fetch is fine. Web Storage only for tiny strings. Cache Storage for HTTP assets / shell. IndexedDB for structured app data. OPFS for files. Network-only for must-be-live money. (Lessons 1, 4)

Gate B · Warehouse

Named versioned caches; Request/Response only; add vs put; match rules (query / method / Vary); delete entry vs delete whole name. (Lesson 2)

Gate C · Policy

SW: install precache, activate cleanup, fetch strategy per route (cache-first, network-first, SWR, network-only, cache-only). Warehouse ≠ policy. (Lesson 3)

Gate D · Ship risks

Versioning/no-expiry, opaque/CORS, HTTP cache vs SW, quota/eviction (Safari caps), clone when put+return, runtime bloat bounds. (Lesson 4)

Sentence you should be able to say

Keep the print playbook open after this course — compressed form of all five lessons.

2. Practice — full briefs

Pick the best default package. Equal-length options.

Brief A · Offline app shell

SPA must show UI offline on return visits. Fingerprinted JS/CSS + index.html. No entity offline store in this brief.

Brief B · Offline drafts

Notes app: multi-KB rich drafts offline, filter by project, reopen days later same browser. Sync may lag. Same-origin SPA.

Brief C · User avatars

Show avatars immediately; slightly stale is fine; update on later visits. Many unique URLs over months.

Brief D · Checkout totals

Payment intent and cart total must never display a stale cached amount as if it were the live server truth.

Brief E · Stale deploys

Team ships static-v1…v5 never deletes old names; SWR assets also have year-long max-age. Users report old JS after deploys.

3. What to remember

A picks the store · B shapes the warehouse · C picks the SW policy · D owns one real risk.
Default: Cache Storage for load resources; IndexedDB for app data; don’t invent a strategy without a job.
Design-review sentence beats “we’ll add a service worker.”

Ask your teacher Paste a real feature brief from your team and we’ll run the four gates on it. Follow-ups are part of the method.

Optional enrichment (not required)

When you want the deferred primaries: Storage for the web, Cache API quick guide, Offline Cookbook, SW caching and HTTP caching.