AddThisFeature

PWA Support

Make your web app installable.

moderate Developer Experience

What it adds

A manifest, icons, and a service worker so users can install the app and it survives a flaky connection.

What your agent is told to do

4
  1. 1

    Add a web app manifest with a name, icons at every required size, theme colour, and display mode.

  2. 2

    Register a service worker that caches the app shell and static assets.

  3. 3

    Provide an offline fallback page rather than the browser's dinosaur.

  4. 4

    Be deliberate about what you cache. Caching API responses without a strategy will show users stale data.

Edge cases it handles

5
  • A service worker will serve a STALE app forever if you don't handle updates — implement a skipWaiting/refresh prompt.
  • Never cache authenticated API responses in a shared cache — that's a cross-user data leak on shared devices.
  • Cached assets must be invalidated on deploy, or users run last week's JavaScript against this week's API.
  • The install prompt must not be shown immediately on first visit.
  • Signing out must clear caches containing user data.

Definition of done

8
  • The app is installable with a valid manifest and icons.
  • A service worker caches the shell and static assets.
  • An offline fallback exists.
  • Deploys invalidate stale caches and prompt an update.
  • No authenticated data is cached in a shared cache.
  • Signing out clears user-specific caches.
  • The feature matches the existing design system.
  • No existing functionality is broken.

Related features

How it works

  1. 1

    Copy the link

    Grab the Markdown instruction URL for this feature.

  2. 2

    Give it to your AI

    Paste it into Claude Code, Cursor, v0, Lovable — whatever you build with.

  3. 3

    It inspects, then implements

    Your agent reads your existing app first, then adds the feature to fit it.

Works with your stack

These instructions are written to adapt. They tell the agent to detect your framework, match your existing design system, and reuse what you already have — rather than assuming a particular stack.

Need it tighter than that? Customize the feature and tell it exactly what you're running.