tessl install https://github.com/softaworks/agent-toolkit --skill react-useeffectgithub.com/softaworks/agent-toolkit
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.
Average Score
88%
Content
85%
Description
90%
Generated
Validations
Total score
13/16| Criteria | Score |
|---|---|
skill_md_line_count SKILL.md line count is 54 (<= 500) | |
frontmatter_valid YAML frontmatter is valid | |
name_field 'name' field is valid: 'react-useeffect' | |
description_field 'description' field is valid (214 chars) | |
description_voice 'description' uses third person voice | |
description_trigger_hint Description includes an explicit trigger hint | |
compatibility_field 'compatibility' field not present (optional) | |
allowed_tools_field 'allowed-tools' field not present (optional) | |
metadata_version 'metadata' field is not a dictionary | |
metadata_field 'metadata' field not present (optional) | |
license_field 'license' field is missing | |
frontmatter_unknown_keys No unknown frontmatter keys found | |
body_present SKILL.md body is present | |
body_examples Examples detected (code fence or 'Example' wording) | |
body_output_format No obvious output/return/format terms detected; consider specifying expected outputs | |
body_steps Step-by-step structure detected (ordered list) |
Content
Suggestions 2
Total score
11/12| Dimension | Score |
|---|---|
conciseness Extremely lean and efficient. Uses tables and decision trees to convey maximum information with minimal tokens. No unnecessary explanations of React basics Claude already knows. | 3/3 |
actionability Provides clear conceptual guidance with DON'T/DO patterns, but lacks executable code examples. The decision tree is helpful but the actual implementations are described rather than shown with copy-paste ready code. | 2/3 |
workflow_clarity The decision tree provides an excellent clear sequence for determining the right approach. For a conceptual/pattern skill (not a multi-step process), the workflow of 'identify situation → choose approach' is unambiguous. | 3/3 |
progressive_disclosure Clean overview structure with well-signaled one-level-deep references to anti-patterns.md and alternatives.md. Content is appropriately split between quick reference and detailed guidance. | 3/3 |
Suggestions
Add 1-2 executable code examples showing the correct pattern (e.g., calculating derived state during render vs using useEffect)
Include a brief code snippet demonstrating the 'key prop' pattern for resetting state, as this is a less intuitive solution
Overall Assessment
This is a well-structured skill that efficiently communicates React useEffect best practices through tables and decision trees. Its main weakness is the lack of concrete code examples showing the correct implementations - the DON'T/DO table tells you what to do but doesn't show executable code for the 'DO' column. The progressive disclosure and organization are excellent.
Description
Total score
11/12| Dimension | Score |
|---|---|
specificity Names the domain (React useEffect) and mentions some actions like 'writing/reviewing useEffect, useState for derived values, data fetching, state synchronization', but doesn't list comprehensive concrete actions - focuses more on topics than specific capabilities. | 2/3 |
completeness Clearly answers both what ('React useEffect best practices', 'Teaches when NOT to use Effect and better alternatives') and when ('Use when writing/reviewing useEffect, useState for derived values, data fetching, or state synchronization') with explicit trigger guidance. | 3/3 |
trigger_term_quality Includes natural keywords users would say: 'useEffect', 'useState', 'derived values', 'data fetching', 'state synchronization', 'Effect'. These are terms React developers naturally use when seeking this guidance. | 3/3 |
distinctiveness_conflict_risk Highly specific to React useEffect patterns with distinct triggers like 'useEffect', 'useState', 'derived values'. Unlikely to conflict with general React skills or other framework skills due to the specific hook-focused terminology. | 3/3 |
Overall Assessment
This is a strong skill description that clearly identifies its niche (React useEffect best practices) and provides explicit trigger conditions. The description effectively communicates both the purpose and when to use it, with good coverage of natural developer terminology. Minor improvement could be made by listing more specific concrete actions beyond 'best practices'.