CtrlK
BlogDocsLog inGet started
Tessl Logo

react-best-practices

Comprehensive performance optimization guide for React and Next.js applications, maintained by Vercel. Use when writing new React components or Next.js pages, implementing data fetching (client or server-side), or reviewing code for performance issues.

54

Quality

61%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

SecuritybySnyk

Passed

No findings from the security scan

Fix and improve this skill with Tessl

tessl review fix ./plugins/AI-Agents-Safe-Coding-Skills-claude/skills/react-best-practices/SKILL.md

The canonical home for this skill is react-best-practices in administrakt0r/AI-Agents-Safe-Coding-Skills

SKILL.md
Quality
Evals
Security

Quality

Content

36%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 body is a well-organized reference index but lacks executable code, a sequenced workflow, and validation, and its references point to bundle files that do not exist. It functions as a table of contents rather than an actionable skill body.

Suggestions

Add at least one concrete, executable code example per high-priority category (e.g. a Promise.all before/after for async-parallel) so guidance is copy-paste ready, or ensure the referenced rules/*.md files are bundled.

Ship the referenced 'rules/*.md' and 'AGENTS.md' files (or remove the dead references) so progressive-disclosure navigation actually resolves.

Remove the duplicated 'When to Use' section and the generic boilerplate closing line to tighten token efficiency.

DimensionReasoningScore

Conciseness

The core is a lean rule index, but it carries redundancy — a duplicated 'When to Use' section, the opening sentence repeating the description verbatim, and a generic boilerplate closing line — beyond minor trimming, so it lands at the 'mostly efficient but could be tightened' anchor rather than 4.

3 / 5

Actionability

No executable code or commands are present; rules are one-line glosses (e.g. 'Use Promise.all() for independent operations') with a few API names but no copy-paste-ready examples, fitting the 'minimal concrete guidance; high-level hints' anchor.

2 / 5

Workflow Clarity

There is no sequenced multi-step process — the body is a categorized reference list — and 'How to Use' only points to reading rule files, so steps are poorly defined with no checkpoints.

2 / 5

Progressive Disclosure

High-level structure (priority table, categorized quick reference) is good and references are one level deep, but the referenced 'rules/*.md' and 'AGENTS.md' files do not exist in the bundle, so navigation is broken, capping it below 4.

3 / 5

Total

10

/

20

Passed

Description

87%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 is strong: it clearly states what the skill does and when to use it with concrete, natural trigger phrases and a well-defined niche. Minor gains are possible by adding a couple of synonyms/file extensions and enumerating additional actions like refactoring.

DimensionReasoningScore

Specificity

Names the domain and lists several concrete actions ('writing new React components or Next.js pages', 'implementing data fetching', 'reviewing code for performance issues') but coverage is not fully comprehensive (e.g., refactoring, bundle-size optimization not enumerated), so it sits below the 5 anchor.

4 / 5

Completeness

Explicitly answers both 'what' (performance optimization guide for React/Next.js) and 'when' ('Use when writing new React components or Next.js pages, implementing data fetching..., or reviewing code for performance issues') with concrete trigger phrases.

5 / 5

Trigger Term Quality

Includes natural terms a user would say — 'React', 'Next.js', 'React components', 'Next.js pages', 'data fetching', 'performance issues' — but misses some synonyms/extensions like '.tsx' or 'JSX', keeping it just below comprehensive.

4 / 5

Distinctiveness Conflict Risk

Has a clear niche (React/Next.js performance) with distinct triggers and minimal overlap risk with other skills.

5 / 5

Total

18

/

20

Passed

Validation

93%

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

Validation15 / 16 Passed

Validation for skill structure

CriteriaDescriptionResult

frontmatter_unknown_keys

Unknown frontmatter key(s) found; consider removing or moving to metadata

Warning

Total

15

/

16

Passed

Repository
administrakt0r/AI-Agents-Safe-Coding-Skills
Reviewed

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.