service-worker
Service Worker
Overview
Service workers are event-driven scripts that run in a separate thread from the main page, intercepting network requests, managing caches, and enabling offline functionality. Workbox v7.4 (maintained by the Chrome Aurora team) provides a production-ready abstraction over the low-level Cache API and fetch event handling.
When to use: Progressive web apps needing offline support, apps requiring push notifications, background data synchronization, app shell caching, network request optimization with static routing.
When NOT to use: Simple static sites served from a CDN, server-rendered apps with no offline requirements, apps where stale data is unacceptable (use network-only), prototypes where caching complexity is premature.
Quick Reference
| Pattern | API / Tool | Key Points |
|---|---|---|
| Registration | navigator.serviceWorker.register() |
Register in window context, scope defaults to path |
| Precaching | workbox-precaching |
Revision-hashed app shell, injected at build time |
| Cache-first | CacheFirst strategy |
Static assets, fonts, images |
| Network-first | NetworkFirst strategy |
API responses needing freshness |
| Stale-while-revalidate | StaleWhileRevalidate strategy |
Balance between speed and freshness |
More from oakoss/agent-skills
playwright
|
202ui-ux-polish
Iterative UI/UX polishing workflow for web applications. Use when improving visual polish, refining desktop and mobile UX separately, running iterative enhancement cycles, applying design patterns like glassmorphism or bento grids, or auditing accessibility and WCAG compliance. Use for Stripe-level visual quality, responsive optimization, and design system alignment.
155find-skills
|
119knowledge-graph-builder
>
102tailwind
Tailwind CSS v4 patterns and design systems. Use when configuring Tailwind themes, building components, implementing dark mode, using container queries, migrating from v3, integrating shadcn/ui, or fixing build errors. Use for tailwind, css, styling, theme, design-tokens.
85pnpm-workspace
pnpm workspace monorepo management with filtering, catalogs, and shared configs. Use when setting up monorepos, managing workspace dependencies, filtering package commands, or sharing configuration across packages.
78