vercel-react-best-practices

To optimize React and Next.js performance, you must eliminate data fetching waterfalls, reduce bundle size, and improve re-render cycles. This skill provides actionable refactoring rules and code examples to target these critical bottlenecks directly.

Fixing slow page loads in a Next.js app requires auditing server-side waterfalls and optimizing bundle sizes. This skill analyzes your codebase to identify these specific performance bottlenecks and provides clear refactoring instructions.

Data fetching strategy affects React rendering performance by creating waterfalls that delay load times. This skill guides you in optimizing both server-side and client-side data fetching to ensure smoother user interactions and efficient resource utilization.

You can get specific code refactoring examples for React re-render optimization through this skill. It provides actionable rules covering advanced patterns to prevent unnecessary renders and enhance user experience.

This performance auditing approach works for both client-side and server-side code in Next.js. It identifies bottlenecks across data fetching, bundle size, and rendering to provide comprehensive optimization guidelines.