vercel-react-best-practices

To eliminate data fetching waterfalls in Next.js applications, apply 57 actionable rules from this Skill that provide incorrect versus correct code examples to guide component architecture and data fetching refactoring.

Best practices for reducing React bundle size and optimizing server-side rendering include replacing heavy barrel file imports with direct imports, guided by 57 performance rules across 8 categories to improve load times and runtime efficiency.

Slow load times and unnecessary re-renders in React dashboards are caused by inefficient data fetching and component structure, which this Skill diagnoses by auditing code against 57 performance optimization rules across 8 categories.

Yes, you can use this Skill to guide AI agents through React refactoring tasks by providing them with clear incorrect versus correct code examples to implement high-impact performance optimizations for new feature development and code review.

This Skill works for both plain React and Next.js performance optimization, addressing common bottlenecks like unnecessary re-renders and inefficient data fetching to improve Time to Interactive across component architectures.