vercel-react-best-practices

To optimize React and Next.js performance, eliminate data fetching waterfalls, minimize bundle size through code splitting, and improve re-render efficiency. This Skill provides 57 rules across 8 categories to guide these refactoring steps.

Best practices for Next.js data fetching involve parallelizing requests to eliminate waterfalls and strategically choosing between server-side and client-side fetching. This approach ensures faster load times and a smoother user experience.

You can reduce React bundle size by applying effective code splitting and optimizing component imports. This Skill offers specific refactoring examples to help you trim unnecessary code and improve overall application speed.

Frequent React re-renders often stem from inefficient state management or prop changes. This Skill helps you fix re-render efficiency by providing targeted rules to refactor components and minimize unnecessary rendering cycles.

Yes, this React optimization guide works for existing codebases by providing code refactoring guidance. You can apply the rules to refactor existing components for better data fetching, bundle size, and rendering performance.