frontend-optimistic-mutations
A portable, framework-agnostic discipline for the write path of any React or React Native app using a query/cache layer. Codifies the optimistic-update lifecycle (cancel in-flight queries → snapshot every affected cache → patch instantly → roll back verbatim on error → invalidate on...
Profile →npx skills add sickn33/agentic-awesome-skills --skill frontend-optimistic-mutations --agent claude-code
Same command for any agent — swap --agent for codex, cursor, copilot.
Weekly change comes from our own snapshots, not the repository page — it measures attention, not adoption.
# Frontend Optimistic Mutations (the write path) ## When to Use Use this skill when you need a portable, framework-agnostic discipline for the write path of any React or React Native app using a query/cache layer. Codifies the optimistic-update lifecycle (cancel in-flight queries → snapshot every affected cache → patch instantly → roll back verbatim on error → invalidate on... > Portable skill — readable by Claude Code, OpenCode, Codex, Cursor, Windsurf, and others. > This skill describes the **discipline of the write path** — optimistic updates, rollback, > idempotency, cache coherence — not a UI library or a styling system. It builds directly on the > **frontend-data-contracts** skill (writes go through the typed client) and the > **frontend-architecture** skill (mutations live in `modules/{feature}/hooks/`, keyed by a factory). The goal: a write **feels instant** (the UI reflects it before the server confirms), is **safe** (a failure restores the exact prior state, and a retry never double-charges), and leaves the cache **coherent** (the detail view and every list page agree). All three at once — that's the craft. --- ## 0. The five core ideas 1. **The optimistic lifecycle is fi
- When to Use
- 0. The five core ideas
- 1. When to be optimistic (and when not)
- 2. The optimistic lifecycle (TanStack Query)
- 3. Non-optimistic writes: create with server-owned fields
- 4. Cache coherence (lock-step detail + lists)
- 5. Idempotency (safe retries on money-moving writes)
- 6. Retry policy
- 7. Library adapters
- 8. Conventions checklist (enforce in review)
- 9. How to apply this skill
- Publishing / installing this skill
- Limitations
What does the frontend-optimistic-mutations skill do?
A portable, framework-agnostic discipline for the write path of any React or React Native app using a query/cache layer. Codifies the optimistic-update lifecycle (cancel in-flight queries → snapshot every affected cache → patch instantly → roll back verbatim on error → invalidate on...
How do I install it?
Run `npx skills add sickn33/agentic-awesome-skills --skill frontend-optimistic-mutations --agent claude-code` — it drops the skill into your project so the agent can pick it up. Swap the --agent value for codex, cursor or copilot if you use one of those.
Where does this skill come from?
From sickn33/agentic-awesome-skills, a repository with 44,414 stars. We read it straight from the repository tree rather than a submitted listing, so what you see here is what is actually published.
Is a popular skill a good skill?
Not necessarily. Stars measure attention, not adoption — a repository can trend for a week and be abandoned. That is why we show the weekly change from our own snapshots next to the total, instead of a single flattering number.