🎯

vercel-react-best-practices

🎯Skill

from vercel-labs/agent-skills

What it does

React and Next.js performance optimization guidelines from Vercel Engineering. 40+ rules across 8 categories covering component performance, data fetching, and bundle size optimization.

Overview

The "vercel-react-best-practices" Claude Code skill provides comprehensive React and Next.js performance optimization guidelines sourced from Vercel Engineering. It offers a detailed collection of 40+ rules across 8 critical performance and optimization categories to help developers write more efficient React applications.

Key Features

Covers performance optimization rules across multiple categories
Prioritizes guidelines by impact level (Critical to Low-Medium)
Provides targeted advice for React and Next.js development
Helps eliminate performance bottlenecks and improve application efficiency
Supports both client-side and server-side performance improvements

Who is this for?

Developers and engineering teams looking to significantly improve their React and Next.js application performance will benefit from this skill. It provides expert-level, actionable guidelines directly from Vercel's engineering team, helping teams systematically identify and resolve performance issues across different aspects of React development.

📦

Same repository

vercel-labs/agent-skills(13 items)

📚 Related Resources

📝Introducing: React Best Practices

vercel.com

📝Agent Skills Explained: An FAQ

vercel.com

vercel-react-best-practices

Installation

Vibe Index InstallInstalls to .claude/skills/ - auto-recognized by Claude Code

npx vibeindex add vercel-labs/agent-skills --skill vercel-react-best-practices

skills.sh Install⚠ Installs to .agents/skills/ - may not be auto-recognized by Claude Code

npx skills add vercel-labs/agent-skills --skill vercel-react-best-practices

Manual InstallCopy SKILL.md content and save to the path below

~/.claude/skills/vercel-react-best-practices/SKILL.md

SKILL.md

201,201Installs

18,734

Last UpdatedJan 26, 2026

View on GitHub Back to Skills

More from this repository10

🎯

web-design-guidelines🎯Skill

Web interface best practices auditor from Vercel Engineering. Reviews UI code against 100+ standards covering accessibility, animations, forms, images, and UX fundamentals.

🎯

vercel-composition-patterns🎯Skill

React composition patterns skill from Vercel Labs that helps avoid boolean prop proliferation through compound components, state lifting, and internal composition techniques.

🎯

vercel-react-native-skills🎯Skill

React Native best practices skill with 16 rules across 7 sections covering performance, layout, animation, images, state management, architecture, and platform-specific patterns for Expo and React Native apps.

🎯

react-native-skills🎯Skill

React Native best practices optimized for AI agents from Vercel Engineering. 16 rules across 7 sections covering mobile performance, layout patterns, animations, and platform-specific implementation.

🎯

composition-patterns🎯Skill

Guides AI agents in implementing robust software design patterns for component composition, modularity, and reusability across different programming paradigms.

🎯

deploy-to-vercel🎯Skill

Skill

🎯

vercel-deploy🎯Skill

Automates Vercel deployment configuration and deployment processes for AI agents, generating optimal deployment settings and triggering builds programmatically.

🎯

subpath-escape🎯Skill

Skill

🎯

frontend-design🎯Skill

Skill

🎯

remote_traversal_confirmed🎯Skill

Skill