react-perf

name	react-perf
description	React/Next.js performance optimization guidelines from Vercel Engineering. Use when reviewing performance, optimizing bundles, or fixing waterfalls.
allowed-tools	Read, Glob, Grep, Task, TodoWrite
model	sonnet

React Performance Optimization

Guidelines from Vercel Engineering for React and Next.js performance.

Source Reference

Full rules: ~/dev/vercel-labs/agent-skills/skills/react-best-practices/rules/

When to Use

• User requests performance review or optimization
• Investigating slow renders or bundle size
• Fixing waterfall data fetching patterns

Rule Categories

Universal (Vite + Next.js)

Load these rules for any React project:

• async-parallel.md - Promise.all() for independent operations (CRITICAL)
• async-defer-await.md - Defer await until needed (HIGH)
• bundle-barrel-imports.md - Avoid barrel file imports (CRITICAL)
• rerender-functional-setstate.md - Use functional setState (MEDIUM)
• rerender-lazy-state-init.md - Lazy state initialization (MEDIUM)
• rerender-transitions.md - Use transitions for non-urgent updates (MEDIUM)
• js-set-map-lookups.md - Use Set/Map for O(1) lookups