Vercel React Best Practices

We've encapsulated 10+ years of React and Next.js optimization knowledge into react-best-practices, a structured repository optimized for AI agents and LLMs. React performance work is usually, well, reactive. A release goes out, the app feels slower, and the team starts chasing symptoms. That’s expensive, and it’s easy to optimize the wrong thing. We’ve seen the same root causes across production codebases for more than a decade: - Async work that accidentally becomes sequential - Large client bundles that grow over time - Components that re-render more than they need to The “why” here is simple: these aren’t micro-optimizations. They show up as waiting time, jank, and repeat costs that hit every user session. So, we put together this React best practices framework to make those problems easier to spot and faster to fix. --- USING REACT-BEST-PRACTICES IN YOUR CODING AGENT These best practices are also packaged up as Agent Skills that install into Opencode, Codex, Claude Code, Cursor, and other coding agents. When your agent spots cascading useEffect calls or heavy client-side imports, it can reference these patterns and suggest fixes. npx add-skill vercel-labs/agent-skills