From vanguard-frontier-agentic
Statically reviews useState/useEffect/useReducer call sites for React anti-patterns, race conditions, and stale closures, producing ranked file:line findings.
How this skill is triggered — by the user, by Claude, or both
Slash command
/vanguard-frontier-agentic:react-state-effects-reviewThis skill is limited to the following tools:
The summary Claude sees in its skill listing — used to decide when to auto-load this skill
Review `useState`, `useEffect`, and `useReducer` call sites for the specific defect classes React's own documentation calls out — effects that should be render-time computations or event-handler logic, missing cleanup/cancellation guards on async effects, and stale closures caused by dependency-array mistakes — without re-litigating component decomposition, styling, or live performance profilin...
Review useState, useEffect, and useReducer call sites for the specific defect classes React's own documentation calls out — effects that should be render-time computations or event-handler logic, missing cleanup/cancellation guards on async effects, and stale closures caused by dependency-array mistakes — without re-litigating component decomposition, styling, or live performance profiling in every response. This skill exists so those adjacent concerns stay out of scope and the review stays focused on the documented anti-pattern catalog plus race-condition and stale-closure evidence.
Use this skill when the user asks to:
useEffect, useState, or useReducer before merge,Do not use this skill for:
componentDidMount, componentDidUpdate, componentWillUnmount) — different API surface; use a general React review instead,react-component-architecture-review.resolve-library-id (matched result: /reactjs/react.dev) before labeling any specific pattern as an anti-pattern.query-docs for the exact pattern in question (e.g., "adjusting state on prop change", "resetting state with a key") — do not assert the anti-pattern classification from memory, and do not assume every effect matches the catalog without checking which entry actually applies.package.json first to confirm the installed React major version. useEffectEvent (stable in React 19.2) is the documented fix for a specific class of stale-closure problem; if the repo is on an older major, that specific fix is unavailable and the finding must recommend the pre-19.2 pattern (ref/callback ref, or accepting the value as a dependency) instead.query-docs before assuming manual dependency-array reasoning is unchanged — do not assume compiler-driven memoization rules automatically apply to hand-authored effects.official_docs URLs in this skill's metadata.json and label the claim documentation-based, unverified against current release.package.json to confirm the installed React major and whether useEffectEvent is available before recommending it as a fix.key instead), or (c) event-handler logic misplaced in an effect (should run in the handler that caused it, not react to a state change). Do not apply one verdict to all effects uniformly.ignore flag checked before the state update, or an AbortController). Its absence is a race-condition finding, not a style note — describe the concrete input sequence that triggers stale data (e.g., "slow request for user A resolves after the fast request for user B, overwriting B's data with A's").setState function, a dispatch function, a ref.current read inside the effect, or a value wrapped in useEffectEvent where the repo's React version supports it) — otherwise it is a stale-closure finding.Load these only when needed:
Return, at minimum:
repo evidence, documentation-based, or inference),npx claudepluginhub raishin/vanguard-frontier-agentic --plugin vanguard-frontier-agenticAudits React codebases for anti-patterns including useEffect misuse, stale closures, derived state in effects, and memory leaks. Produces scored gap analysis table with severity ratings and applies prioritized fixes on request.
Audit React components for unnecessary useEffect patterns. Detects 9 anti-patterns from "You Might Not Need an Effect" and proposes fixes with severity levels.
Reviews React hooks against design principles: object returns, SSR-safe init, effect cleanup, TypeScript generics, performance, and state patterns.