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.

60

Quality

70%

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 ./.agents/skills/vercel-react-best-practices/SKILL.md
SKILL.md
Quality
Evals
Security

Quality

Content

71%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.

A clean, well-organized rule catalog with concrete, actionable directives and efficient one-liners. Its main weakness is structural: the body points to AGENTS.md and rules/*.md files that are not bundled, so the progressive-disclosure payoff is missing.

Suggestions

Bundle the referenced rules/*.md files and AGENTS.md so the signaled references actually resolve, or inline the most critical examples directly in SKILL.md.

Trim the defensive AGENTS.md blockquote to a single clarifying line to save tokens.

Add a short decision hint (e.g., 'start with CRITICAL async- and bundle- rules') to make rule selection more explicit.

DimensionReasoningScore

Conciseness

The 65 one-line rule entries are lean and each earns its place, but the AGENTS.md disclaimer blockquote and the 'Each rule file contains:' enumeration are minor defensive padding that could be trimmed.

4 / 5

Actionability

Rules name concrete, applicable APIs and patterns (Promise.all(), next/dynamic, React.cache(), useTransition, content-visibility), giving actionable directives; gaps are minor since full code examples are intentionally deferred to reference files.

4 / 5

Workflow Clarity

Well-organized for a reference skill: prioritized categories, prefixed rule ids, and a 'How to Use' section pointing to rule files give clear navigation, with no destructive/batch operations requiring validation checkpoints.

4 / 5

Progressive Disclosure

The overview is well-signaled and references are one level deep (rules/*.md, AGENTS.md), but the referenced files are not present in the bundle, so the disclosure structure does not actually resolve and navigation breaks.

3 / 5

Total

15

/

20

Passed

Description

70%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.

A well-constructed description that explicitly states both what the skill is and when to use it, with strong natural trigger terms and a clear niche. It is held back from the top tier by a 'what' framed as passive guidelines and slightly generic action verbs.

Suggestions

Lead the 'what' with concrete capabilities (e.g., 'Applies 65 prioritized performance rules to React/Next.js code') instead of describing the skill as 'guidelines'.

Add common synonyms users say (hydration, SSR, rendering, re-renders) to broaden trigger coverage.

DimensionReasoningScore

Specificity

Names the domain ('React and Next.js performance optimization guidelines') and a few actions ('writing, reviewing, or refactoring'), but the actions are generic user verbs rather than concrete skill capabilities, and the 'what' is a passive resource ('guidelines').

3 / 5

Completeness

Both 'what' and 'when' are present and the 'when' is explicit with concrete trigger phrases ('should be used when', 'Triggers on'), but the 'what' is stated as guidelines rather than concrete actions, keeping it just below the top anchor.

4 / 5

Trigger Term Quality

Good natural keyword coverage ('React components, Next.js pages, data fetching, bundle optimization, performance improvements') that users would actually say, though some synonyms (hydration, SSR, rendering) are missing.

4 / 5

Distinctiveness Conflict Risk

Clear niche (React/Next.js performance optimization) with specific triggers, though minor overlap risk exists with general React/Next.js development or general performance skills.

4 / 5

Total

15

/

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

relative_links

Relative link issues: 1 missing

Warning

Total

15

/

16

Passed

Repository
calesthio/OpenMontage
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.