vercel-react-best-practices

To optimize React and Next.js performance, apply over 50 prioritized rules covering waterfalls, bundle size, server-side rendering, client-side fetching, and re-render optimization. These rules provide incorrect versus correct code examples to guide automated refactoring.

The best way to reduce bundle size in Next.js involves applying specific optimization rules that target JavaScript performance and rendering efficiency. This Skill provides categorized guidelines to identify and refactor code causing large bundle sizes.

Eliminating waterfalls improves server-side performance by preventing sequential data fetching that blocks rendering. This Skill provides rules to refactor client-side fetching and server-side logic for faster load times.

Yes, these React optimization rules specifically address client-side data fetching and excessive re-renders. They offer detailed examples to refactor components, ensuring optimal rendering performance and efficient data retrieval.

To fix slow load times and rendering bottlenecks, refactor React components using the provided incorrect versus correct code examples. This Skill guides code generation to resolve performance issues related to bundle size and inefficient rendering.

No prior knowledge of advanced patterns is required, as the guidelines offer clear incorrect versus correct code examples for each rule. Developers can directly apply these prioritized rules to refactor code and achieve optimal performance.