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.

1.22x

Quality

79%

Does it follow best practices?

Impact

92%

1.22x

Average score across 3 eval scenarios

Securityby

Passed

No findings from the security scan

Fix and improve this skill with Tessl

tessl review fix ./.cursor/skills/vercel-react-best-practices/SKILL.md

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 well-organized, lean reference catalog with concrete actionable directives and clear navigation guidance. Its main weakness is progressive disclosure: the referenced detail files (rules/*.md, AGENTS.md) do not exist in the bundle, breaking the intended navigation, and the full rule catalog is inlined.

Suggestions

Bundle the referenced 'rules/*.md' files and 'AGENTS.md' so the signaled navigation actually resolves, or remove the references and inline the necessary detail.

Consider moving the full 58-rule Quick Reference into a separate reference file linked from SKILL.md to reduce inlined catalog length.

Trim the 'When to Apply' section since its triggers overlap the frontmatter description, or differentiate it with non-duplicate guidance.

Dimension	Reasoning	Score
Conciseness	The body is lean with no concept over-explanation — terse one-line rule descriptions and a priority table — but the 'When to Apply' section partially echoes the frontmatter description's triggers, a minor redundancy that could be trimmed.	4 / 5
Actionability	Directives are concrete and specific ('Use Promise.all() for independent operations', 'Import directly, avoid barrel files', 'Use React.cache() for per-request deduplication'); full code examples are deferred to referenced rule files, leaving minor gaps in the body itself.	4 / 5
Workflow Clarity	Clear navigation/application flow via the priority-impact table, 'When to Apply' guidance, and a 'How to Use' section explaining the rule-file layout; no validation checkpoints are needed since this is a non-destructive reference skill.	4 / 5
Progressive Disclosure	Structure is conceptually good with signaled one-level-deep references to 'rules/*.md' and 'AGENTS.md', but those referenced files are absent from the bundle (no references/scripts/assets directories exist), so navigation is broken, and the full 58-rule catalog is inlined in SKILL.md.	3 / 5
	Total	15 / 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.

A strong description that clearly states what the skill provides and when to use it, with concrete trigger phrases and a distinct React/Next.js performance niche. The only minor weakness is that the core action is framed as 'guidelines' rather than concrete transformations.

Dimension	Reasoning	Score
Specificity	Names the domain and lists several concrete activities — 'writing, reviewing, or refactoring React/Next.js code' plus 'data fetching, bundle optimization, performance improvements' — but the core capability is framed as advisory 'guidelines' rather than a concrete transformation, leaving minor gaps versus comprehensive.	4 / 5
Completeness	Explicitly answers both 'what' ('React and Next.js performance optimization guidelines from Vercel Engineering') and 'when' ('This skill should be used when writing, reviewing, or refactoring... Triggers on tasks involving...') with concrete trigger phrases.	5 / 5
Trigger Term Quality	Good coverage of natural terms users would say — 'React components, Next.js pages, data fetching, bundle optimization, performance improvements' — with only a few synonyms/common variations missing.	4 / 5
Distinctiveness Conflict Risk	Clear niche (React/Next.js performance optimization from Vercel) with distinct, specific triggers and minimal overlap risk with other skills.	5 / 5
	Total	18 / 20 Passed

Validation

100%

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 — 16 / 16 Passed

Validation for skill structure

No warnings or errors.

Repository: MODSetter/SurfSense
Path: .cursor/skills/vercel-react-best-practices/SKILL.md
Commit: d96e29d

Reviewed: 8 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.