网有NETHAVE
AGENT SKILL

vercel-react-best-practices

React and Next.js performance optimization guidelines from Vercel Engineering

使用场景前端开发
License 许可
MIT
所属仓库
HigorAlves/orc
最近更新
2026-11-07
Stars
★ 7
Forks
0

01 前言 Front Matter

name
vercel-react-best-practices
license
MIT
metadata
{ "author": "vercel", "version": "1.0.0" }
description
React and Next.js performance optimization guidelines from Vercel Engineering
when_to_use
Use when writing, reviewing, or refactoring React/Next.js components, data fetching, or bundles for performance.

02 资源文件 76

03 SKILL.md 正文

Vercel React Best Practices

Comprehensive performance optimization guide for React and Next.js applications, maintained by Vercel. Contains 70 rules across 8 categories, prioritized by impact to guide automated refactoring and code generation.

When to Apply

Reference these guidelines when:

  • Writing new React components or Next.js pages
  • Implementing data fetching (client or server-side)
  • Reviewing code for performance issues
  • Refactoring existing React/Next.js code
  • Optimizing bundle size or load times

Rule Categories by Priority

Priority Category Impact Prefix
1 Eliminating Waterfalls CRITICAL async-
2 Bundle Size Optimization CRITICAL bundle-
3 Server-Side Performance HIGH server-
4 Client-Side Data Fetching MEDIUM-HIGH client-
5 Re-render Optimization MEDIUM rerender-
6 Rendering Performance MEDIUM rendering-
7 JavaScript Performance LOW-MEDIUM js-
8 Advanced Patterns LOW advanced-

Quick Reference

Every rule id with a one-line summary, by category: RULE-INDEX.md. Read it to pick the rules that apply to the code at hand; each id names its file under rules/.

How to Use

Read individual rule files for detailed explanations and code examples:

rules/async-parallel.md
rules/bundle-barrel-imports.md

Each rule file contains:

  • Brief explanation of why it matters
  • Incorrect code example with explanation
  • Correct code example with explanation
  • Additional context and references

Full Compiled Document

For the complete guide with all rules expanded: AGENTS.md

04 同仓库更多 Skills

HigorAlves
HigorAlves/orc

writing-plans

Write a comprehensive implementation plan of bite-sized TDD tasks that an engineer with zero codebase context could execute — exact files, code, tests, and verification steps

开发工程师内容创作者写作与文案
★ 7
HigorAlves
HigorAlves/orc

writing-for-agents

orc's doctrine layer for writing any document an agent consumes — skills, AGENTS.md/CLAUDE.md, reference docs

内容创作者写作与文案Skill与智能体开发
★ 7
HigorAlves
HigorAlves/orc

workspace-mode

Use when cwd is a parent dir holding multiple sibling git repos — defines repo auto-detection, --repos/--repo/--all-repos/--this-repo precedence, per-repo dispatch, and linked-PR mechanics.

Skill与智能体开发
★ 7
HigorAlves
HigorAlves/orc

wizard

Generate an interactive bash wizard walking a human through work only they can perform — credentials, secrets, one-off migrations

Skill与智能体开发
★ 7
HigorAlves
HigorAlves/orc

wait-what

Stop and re-pitch — the last message did not land; say it again simply, in the project's own vocabulary.

★ 7
HigorAlves
HigorAlves/orc

vitest

Vitest fast unit testing framework powered by Vite with Jest-compatible API

开发工程师测试与质量
★ 7