# Vercel React Best Practices (agent skill)

> Vercel React Best Practices is an agent skill (a SKILL.md file) from vercel-labs/agent-skills. React and Next.js performance optimization guidelines from Vercel Engineering. It works with Claude Code and has 32,014 GitHub stars across a repository of 4 listed skills. Install it by copying the skill folder into your agent's skills directory.

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. Comprehensive performance optimization guide for React and Next.js applications, maintained by Vercel.

## Key facts

| Fact | Value |
|---|---|
| Repository | https://github.com/vercel-labs/agent-skills |
| Skill path | skills/react-best-practices/SKILL.md |
| Skill name | vercel-react-best-practices |
| GitHub stars | 32,014 |
| Installs on skills.sh | 774,633 |
| License | MIT |
| Skills in repo | 4 |
| Plugin marketplace | no |
| Official | yes |
| Works with | Claude Code |
| Category | Design & frontend |
| Last commit | Aug 28, 2026 |

## When it triggers

- used when writing, reviewing, or refactoring React/Next.
- Triggers on tasks involving React components, Next.

## Add this skill

### Claude Code

```sh
git clone --depth 1 https://github.com/vercel-labs/agent-skills.git
cp -r agent-skills/skills/react-best-practices ~/.claude/skills/vercel-react-best-practices   # personal, or .claude/skills in a project
```

In the Claude apps, zip the skill folder and upload it under Customize > Skills > + > Upload a skill (code execution must be on).

### ChatGPT / Codex

```sh
git clone --depth 1 https://github.com/vercel-labs/agent-skills.git
cp -r agent-skills/skills/react-best-practices .agents/skills/vercel-react-best-practices   # repo; ~/.agents/skills for all projects
```

### Cursor

```sh
git clone --depth 1 https://github.com/vercel-labs/agent-skills.git
cp -r agent-skills/skills/react-best-practices .cursor/skills/vercel-react-best-practices   # project; ~/.cursor/skills for all projects
```

Sources (checked 2026-10-07): https://code.claude.com/docs/en/skills, https://support.claude.com/en/articles/12512180-using-skills-in-claude, https://learn.chatgpt.com/docs/build-skills, https://cursor.com/docs/context/skills

skills.sh listing: https://www.skills.sh/vercel-labs/agent-skills/vercel-react-best-practices

---

Canonical page: https://appsgit.com/skills/vercel-labs-vercel-react-best-practices
Source: appsgit (https://appsgit.com), the app store for github. Data from the GitHub API, refreshed nightly.
Machine access: JSON API https://appsgit.com/api/v1/apps (OpenAPI: https://appsgit.com/openapi.json), MCP server https://mcp.appsgit.com/mcp, full index https://appsgit.com/llms-full.txt.