react

React patterns with destructured props, compiler optimization, Effects, and Tailwind v4 syntax. ALWAYS use when using React.

Quality

54%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

Securityby

Passed

No findings from the security scan

Fix and improve this skill with Tessl

tessl review fix ./.agents/skills/react/SKILL.md

Quality

Content

50%Weight 40%Scale 1-5

Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.

The content is a rich, actionable React patterns reference with strong concrete code examples, but it is over-long and monolithic. Tightening conceptual prose and splitting the large reference sections into separate files would materially improve it.

Suggestions

Trim conceptual prose Claude already knows (design-tokens explainer, Rationalization Table, obvious CSS-variable comments) to respect the token budget.

Move the data-attribute styling reference and the Effects/useEffectEvent deep-dives into separate reference files linked one level deep from SKILL.md.

Fix code-block formatting (stray blank lines mid-function) and replace '// ...' placeholders with complete executable snippets where feasible.

Dimension	Reasoning	Score
Conciseness	The ~1200-line body contains several padded conceptual passages Claude already knows (the design-tokens explainer, the Rationalization Table, obvious variable comments) alongside redundant prose around Effects, making it noticeably verbose despite accurate content.	2 / 5
Actionability	Extensive concrete tsx/css/js examples and Tailwind v4 before/after mappings provide mostly executable, copy-paste-ready guidance, with minor gaps from stray formatting glitches and occasional '// ...' placeholders.	4 / 5
Workflow Clarity	A Derived-State-vs-Effects-vs-Refs decision tree, Red-Flags feedback, and a Migration Guide give clear sequencing, but the skill is fundamentally a rules reference without explicit validation checkpoints in its workflows.	3 / 5
Progressive Disclosure	Section headers and internal anchor links provide reasonable structure, but the body is a 1200-line monolith with the data-attribute reference and Effects deep-dive inlined rather than split into one-level-deep reference files.	3 / 5
	Total	12 / 20 Passed

Description

58%Weight 40%Scale 1-5

Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.

The description clearly identifies its React niche and includes an explicit trigger clause, satisfying the basic what/when requirements. Its weaknesses are a broad trigger that risks overlap and a topic-list style that lacks concrete action verbs and natural synonyms.

Suggestions

Convert the topic list into concrete action verbs, e.g. 'Apply destructured-props patterns, configure React Compiler optimization, and write Tailwind v4 syntax.'

Tighten the trigger to reduce conflict risk, e.g. 'Use when writing or refactoring React components, especially for props, Effects, compiler optimization, or Tailwind v4 styling.'

Add natural synonyms and extension cues users actually say (e.g. '.tsx', 'JSX', 'useEffect', 'React hooks') to improve trigger-term coverage.

Dimension	Reasoning	Score
Specificity	Names the React domain plus four concrete pattern areas (destructured props, compiler optimization, Effects, Tailwind v4), but these are topic nouns rather than action verbs, so it sits at the domain-plus-concrete-areas level rather than listing concrete actions.	3 / 5
Completeness	Answers both 'what' (a list of React pattern areas) and 'when' ('ALWAYS use when using React'), but the 'when' is broad and the 'what' is a topic list rather than concrete actions, so it falls short of the fully concrete anchor 5.	4 / 5
Trigger Term Quality	Includes some natural keywords (React, Tailwind v4, Effects, props) but mixes in jargon like 'compiler optimization' and omits common synonyms and file-extension cues a user might actually say.	3 / 5
Distinctiveness Conflict Risk	The specific niche topics give it some identity, but the 'ALWAYS use when using React' trigger is broad enough to overlap with virtually any other React-related skill.	3 / 5
	Total	13 / 20 Passed

Validation

81%

Warnings & errors only

Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.

Validation — 13 / 16 Passed

Validation for skill structure

Criteria	Description	Result
skill_md_line_count	SKILL.md is long (1210 lines); consider splitting into references/ and linking	Warning
metadata_version	'metadata.version' is missing	Warning
metadata_field	'metadata' should map string keys to string values	Warning

	Total	13 / 16 Passed

Repository: udecode/plate
Path: .agents/skills/react/SKILL.md
Commit: bc7104f

Reviewed: 2 days ago

Table of Contents

Discovery Implementation Validation

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.