react-useeffect
React useEffect best practices from official docs. Use when writing/reviewing useEffect, useState for derived values, data fetching, or state synchronization. Teaches when NOT to use Effect and better alternatives.
91
87%
Does it follow best practices?
Impact
95%
1.02xAverage score across 3 eval scenarios
Passed
No known issues
Evaluation results
100%
Product Catalog Dashboard Component
Derived state without Effects
No Effect for derived string
100%
100%
Render-time derivation
100%
100%
No Effect for filter/transform
100%
100%
useMemo for heavy computation
100%
100%
Correct useMemo deps
100%
100%
No redundant state
100%
100%
Stats computed inline
100%
100%
No Effect for validation
100%
100%
No Effect chains
100%
100%
External Effect appropriate
100%
100%
100%
Live Repository Search Component
Data fetching with cleanup
Cleanup function returned
100%
100%
Stale-response guard
100%
100%
Guard checked before setState
100%
100%
Loading state present
100%
100%
Error state present
100%
100%
Query in dependency array
100%
100%
Custom hook extraction
100%
100%
No Effect for derived display
100%
100%
No parent-propagation via Effect
100%
100%
No Effect chains
100%
100%
87%
7%Interactive Product Selector with Cart
Event handlers vs Effects
Notification in event handler
100%
100%
No Effect for click side effects
0%
100%
Parent callback in event handler
0%
100%
Key prop for state reset
100%
100%
No Effect to reset state
100%
100%
No cascading Effects
100%
100%
Event handler computes next state
100%
100%
Stores ID not object
100%
30%
Derived value from selection
100%
25%
No Effect for derived total
100%
100%
- Repository
- softaworks/agent-toolkit
- Commit
3027f20
- Evaluated
- Agent
- Claude Code
- Model
- Claude Sonnet 4.6
Table of Contents
Is this your skill?
If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.