vercel-react-best-practices

To reduce unnecessary re-renders in React, apply memoization patterns and optimized component design rules to prevent wasted render cycles. This skill provides a catalog of concrete refactoring guidance to optimize rendering behavior and ensure predictable UI updates.

Optimizing React bundle size requires applying framework-agnostic patterns to eliminate code waterfalls and streamline imports. This skill catalogs specific bundle size optimization rules with practical examples to help lower your final JavaScript payload.

Auditing React performance bottlenecks involves evaluating components, data flow, and rendering behavior across eight priority categories. This skill generates an actionable optimization plan by reviewing your code against a curated catalog of performance rules.

Yes, these React performance patterns are framework-agnostic and work across different React setups. The guidance focuses on core rendering, data fetching, and bundling rules that apply universally to improve client-side performance and reliability.

Memoization in React components should be used when re-render optimization is necessary to prevent expensive recalculations and wasted render cycles. This skill provides concrete rules and advanced patterns for correctly applying memoization alongside other rendering performance strategies.