CtrlK
BlogDocsLog inGet started
Tessl Logo

vercel-react-best-practices

React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js code to ensure optimal performance patterns. Triggers on tasks involving React components, Next.js pages, data fetching, bundle optimization, or performance improvements.

69

Quality

85%

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

SKILL.md
Quality
Evals
Security

Quality

Content

70%

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

A clean, token-efficient reference index with strong prioritization and navigation intent, but the body lacks inline executable examples and the referenced rule files / AGENTS.md bundle is absent from the package, so progressive disclosure and actionability are only partially delivered.

Suggestions

Include at least one inline executable code example (e.g. a Promise.all refactor) in the body so the skill is actionable without opening a rule file.

Add a brief validation checkpoint to the 'How to Use' workflow — e.g. verify the refactor preserves behavior / passes type-check before moving on — since the skill guides batch refactoring.

Ship the referenced bundle (rules/*.md and AGENTS.md) alongside SKILL.md, or rework references so they point to files that actually exist in the package.

DimensionReasoningScore

Conciseness

The body is lean and assumes Claude's competence — it lists rule identifiers with one-line descriptions and a priority table without explaining basic React concepts, so every token earns its place.

3 / 3

Actionability

It provides a clear index of named rules and where to find detail, but the SKILL.md body itself contains no executable code or commands — concrete guidance lives one level deeper in rule files, matching 'some concrete guidance but incomplete'.

2 / 3

Workflow Clarity

It prioritizes rules by impact and groups categories, giving a usable selection sequence, but there is no validation/checkpoint loop for the refactoring work it guides, so checkpoints are only implicit rather than explicit.

2 / 3

Progressive Disclosure

It references rule files under rules/ and a compiled AGENTS.md, but those bundle directories (references/scripts/assets) are not present in the skill package, so the signaled one-level-deep references cannot be verified as real, leaving structure only partially realized.

2 / 3

Total

9

/

12

Passed

Description

100%

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

A strong, well-formed description that concretely states capabilities, uses third person, and includes an explicit 'Triggers on...' clause. It answers both what the skill does and when to use it with natural, conflict-resistant terms.

DimensionReasoningScore

Specificity

It names multiple concrete actions — 'writing, reviewing, or refactoring React/Next.js code', 'data fetching', 'bundle optimization', 'performance improvements' — matching the 'lists multiple specific concrete actions' anchor.

3 / 3

Completeness

It explicitly answers both what ('performance optimization guidelines ... ensure optimal performance patterns') and when ('Triggers on tasks involving React components, Next.js pages, data fetching, bundle optimization, or performance improvements'), with an explicit trigger clause.

3 / 3

Trigger Term Quality

It covers natural terms users would say — 'React components', 'Next.js pages', 'data fetching', 'bundle optimization', 'performance improvements' — giving good coverage of common variations rather than technical jargon.

3 / 3

Distinctiveness Conflict Risk

It carves a clear niche — React/Next.js performance optimization — with distinct triggers unlikely to overlap with unrelated skills, matching the 'clear niche with distinct triggers' anchor.

3 / 3

Total

12

/

12

Passed

Validation

100%

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

Validation16 / 16 Passed

Validation for skill structure

No warnings or errors.

Repository
freekmurze/dotfiles
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.