Setting the file. One moment.
Skill 03 · Vercel React Best Practices
Subchapter 3.3
README.mdMarkdown3 KBView on GitHub
A structured repository for creating and maintaining React Best Practices optimized for agents and LLMs.
rules/ - Individual rule files (one per rule)
_sections.md - Section metadata (titles, impacts, descriptions)_template.md - Template for creating new rulesarea-description.md - Individual rule filessrc/ - Build scripts and utilitiesmetadata.json - Document metadata (version, organization, abstract)AGENTS.md - Compiled output (generated)test-cases.json - Test cases for LLM evaluation (generated)Install dependencies:
pnpm installBuild AGENTS.md from rules:
pnpm buildValidate rule files:
pnpm validateExtract test cases:
pnpm extract-testsrules/_template.md to rules/area-description.mdasync- for Eliminating Waterfalls (Section 1)bundle- for Bundle Size Optimization (Section 2)server- for Server-Side Performance (Section 3)client- for Client-Side Data Fetching (Section 4)rerender- for Re-render Optimization (Section 5)rendering- for Rendering Performance (Section 6)js- for JavaScript Performance (Section 7)advanced- for Advanced Patterns (Section 8)pnpm build to regenerate AGENTS.md and test-cases.jsonEach rule file should follow this structure:
---
title: Rule Title Here
impact: MEDIUM
impactDescription: Optional description
tags: tag1, tag2, tag3
---
## Rule Title Here
Brief explanation of the rule and why it matters.
**Incorrect (description of what's wrong):**
```typescript
// Bad code exampleCorrect (description of what’s right):
// Good code exampleOptional explanatory text after examples.
Reference: Link (opens in a new tab)
_ are special (excluded from build)area-description.md (e.g., async-parallel.md)CRITICAL - Highest priority, major performance gainsHIGH - Significant performance improvementsMEDIUM-HIGH - Moderate-high gainsMEDIUM - Moderate performance improvementsLOW-MEDIUM - Low-medium gainsLOW - Incremental improvementspnpm build - Compile rules into AGENTS.mdpnpm validate - Validate all rule filespnpm extract-tests - Extract test cases for LLM evaluationpnpm dev - Build and validateWhen adding or modifying rules:
_template.md structurepnpm build to regenerate AGENTS.md and test-cases.jsonOriginally created by @shuding (opens in a new tab) at Vercel (opens in a new tab).