react-patterns - React 19 Performance & Composition Patterns
Apply Vercel's 62 performance rules and composition patterns to optimize React 19 and Next.js code
Tags
Updated: 2026-03-24Capabilities
Typical Inputs
Typical Outputs
What this skill does
- apply composition patterns
- enforce compound components
- eliminate boolean props
- optimize bundle size
- eliminate waterfalls
- optimize server-side performance
- optimize client-side fetching
- reduce re-renders
- improve rendering performance
- use React.cache()
- use dynamic imports
- use Suspense boundaries
- use Promise.all()
- use React.useOptimistic()
- use React.useTransition()
- analyze React components
- review Next.js pages
- identify performance issues
- refactor component APIs
Inputs
- React components
- Next.js pages
- codebase files
Outputs
- code refactor suggestions
- performance optimization recommendations
- component composition patterns
Requirements
- React 19
- Next.js