| 1 | # Sections |
| 2 | |
| 3 | This file defines all sections, their ordering, impact levels, and descriptions. |
| 4 | The section ID (in parentheses) is the filename prefix used to group rules. |
| 5 | |
| 6 | --- |
| 7 | |
| 8 | ## 1. Eliminating Waterfalls (async) |
| 9 | |
| 10 | **Impact:** CRITICAL |
| 11 | **Description:** Waterfalls are the #1 performance killer. Each sequential await adds full network latency. Eliminating them yields the largest gains. |
| 12 | |
| 13 | ## 2. Bundle Size Optimization (bundle) |
| 14 | |
| 15 | **Impact:** CRITICAL |
| 16 | **Description:** Reducing initial bundle size improves Time to Interactive and Largest Contentful Paint. |
| 17 | |
| 18 | ## 3. Server-Side Performance (server) |
| 19 | |
| 20 | **Impact:** HIGH |
| 21 | **Description:** Optimizing server-side rendering and data fetching eliminates server-side waterfalls and reduces response times. |
| 22 | |
| 23 | ## 4. Client-Side Data Fetching (client) |
| 24 | |
| 25 | **Impact:** MEDIUM-HIGH |
| 26 | **Description:** Automatic deduplication and efficient data fetching patterns reduce redundant network requests. |
| 27 | |
| 28 | ## 5. Re-render Optimization (rerender) |
| 29 | |
| 30 | **Impact:** MEDIUM |
| 31 | **Description:** Reducing unnecessary re-renders minimizes wasted computation and improves UI responsiveness. |
| 32 | |
| 33 | ## 6. Rendering Performance (rendering) |
| 34 | |
| 35 | **Impact:** MEDIUM |
| 36 | **Description:** Optimizing the rendering process reduces the work the browser needs to do. |
| 37 | |
| 38 | ## 7. JavaScript Performance (js) |
| 39 | |
| 40 | **Impact:** LOW-MEDIUM |
| 41 | **Description:** Micro-optimizations for hot paths can add up to meaningful improvements. |
| 42 | |
| 43 | ## 8. Advanced Patterns (advanced) |
| 44 | |
| 45 | **Impact:** LOW |
| 46 | **Description:** Advanced patterns for specific cases that require careful implementation. |