The skill is the skills/react-best-practices folder inside that repository. Copy it into the folder your agent loads skills from; check your agent's documentation for where that is.
about React Best Practices Skill by @vercel-labs
React and Next.js performance optimization guidelines from Vercel Engineering. 40+ rules across 8 categories.
40+ rules across 8 categories, prioritized by impact
Covers eliminating waterfalls, bundle size, and server-side performance
Applies while writing new components or reviewing existing ones
our take
Performance guidance for React and Next.js, grouped by how much each category is likely to matter. It starts with eliminating request waterfalls and shrinking bundles, then moves through server-side performance and client-side data fetching.
when to use it
A Next.js page feels slow and you want a prioritised review
You want an agent to catch waterfalls and oversized bundles in a pull request
You are onboarding a team to performance basics
before you install
Measure before and after; a rule only helps if it addresses your actual bottleneck
The source repository publishes no license, so we link to it rather than host a copy
what's inside
The original SKILL.md is organised into these sections:
When to Apply
Rule Categories by Priority
Quick Reference
1. Eliminating Waterfalls (CRITICAL)
2. Bundle Size Optimization (CRITICAL)
3. Server-Side Performance (HIGH)
4. Client-Side Data Fetching (MEDIUM-HIGH)
5. Re-render Optimization (MEDIUM)
6. Rendering Performance (MEDIUM)
7. JavaScript Performance (LOW-MEDIUM)
8. Advanced Patterns (LOW)
How to Use
source and license
Written and maintained by @vercel-labs. No license is published in that repository, so we link to the original and do not host a copy or offer a download. SkillDirectory does not claim authorship: this page adds our own review and links back to the original, and the skill's text belongs to its author.