react-best-practices

To optimize React and Next.js performance, this Skill audits your code against 57 rules for bundle size reduction, server-side performance, and re-render optimization. It analyzes code for anti-patterns and suggests fixes based on Vercel Engineering best practices.

Best practices for reducing Next.js bundle sizes include applying dynamic import strategies for large components. This Skill identifies unoptimized components causing bloat and recommends specific actions to decrease bundle size and improve load times.

Unnecessary React re-renders are fixed by applying targeted optimization patterns. This Skill analyzes your code to pinpoint rendering performance issues and suggests fixes for client-side data fetching and re-render optimization.

Yes, you can use this Skill to review asynchronous operations and identify waterfalls in your React codebase. It provides actionable rules covering client-side data fetching and advanced patterns to resolve these critical performance issues.

For better web development performance, you should apply JavaScript micro-optimizations and advanced rendering patterns. This Skill provides a comprehensive set of rules covering these micro-optimizations alongside server-side performance enhancements.