vercel-react-best-practices
Vercel React Best Practices
Comprehensive performance optimization guide for React and Next.js applications, maintained by Vercel. Contains 45 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
More from henryxv/study-platform
nextjs-frontend-testing
Use this skill whenever the user wants to set up, improve, or run frontend tests (unit, component, and E2E) for a Next.js (App Router) + TypeScript + Tailwind + shadcn/ui project using Vitest/Jest, React Testing Library, and Playwright.
19next-project-structure
Authoritative guide on Next.js 16+ App Router structure. Use this skill to determine where files should be created, how to name them for routing, and how to organize project architecture.
10landing-page-guide-v2
Create distinctive, high-converting landing pages that combine proven conversion elements with exceptional design quality. Build beautiful, memorable landing pages using Next.js 14+ and ShadCN UI that avoid generic AI aesthetics while following the 11 essential elements framework.
9cartographer
Maps and documents the codebase. Generates `docs/CODEBASE_MAP.md` with architecture diagrams, module relationships, and data flow. Use when the user asks to "map the code", "explain the architecture", or "update documentation".
7prisma-workflow
Strictly enforces Prisma 7 + Next.js App Router protocols. Manages the lifecycle from initialization to deployment. Use for all database tasks.
7doc-coauthoring
Guide users through a structured workflow for co-authoring documentation. Use when user wants to write documentation, proposals, technical specs, decision docs, or similar structured content. This workflow helps users efficiently transfer context, refine content through iteration, and verify the doc works for readers. Trigger when user mentions writing docs, creating proposals, drafting specs, or similar documentation tasks.
6