react-best-practices

# React Best Practices - Performance Optimization Comprehensive performance optimization guide for React and Next.js applications with 40+ rules organized by impact level. Designed to help developers eliminate performance bottlenecks and follow best practices. ## When to use this skill **Use React Best Practices when:** - Optimizing React or Next.js application performance - Reviewing code for performance improvements - Refactoring existing components for better performance - Implementing new features with performance in mind - Debugging slow rendering or loading issues - Reducing bundle size - Eliminating request waterfalls **Key areas covered:** - **Eliminating Waterfalls** (CRITICAL): Prevent sequential async operations - **Bundle Size Optimization** (CRITICAL): Reduce initial JavaScript payload - **Server-Side Performance** (HIGH): Optimize RSC and data fetching - **Client-Side Data Fetching** (MEDIUM-HIGH): Implement efficient caching - **Re-render Optimization** (MEDIUM): Minimize unnecessary re-renders - **Rendering Performance** (MEDIUM): Optimize browser rendering - **JavaScript Performance** (LOW-MEDIUM): Micro-optimizations for hot paths - **Advanced Patterns** (LOW): Specialized techniques for edge cases ## Quick reference ### Critical priorities 1. **Defer await until needed** - Move awaits into branches where they're used 2. **Use Promise.all()** - Parallelize independent async operations 3. **Avoid barrel imports** - Import directly from source files 4. ...