react-best-practices

SKILL.md

Performance patterns and guidelines from react.dev and Vercel Engineering.

| Avoid unnecessary effects | Render cycles, bugs | effect-pitfalls.md | | Eliminate waterfalls | First paint, TTI | async-waterfall-elimination.md | | Parallel data fetching | Load time | async-parallel-requests.md | | Avoid barrel imports | Bundle size | bundle-barrel-imports.md |

| React Compiler (19+) | Auto memoization | react-compiler.md | | Dynamic imports | Code splitting | bundle-dynamic-import.md | | Preload on user intent | Perceived latency | bundle-preload.md | | Strategic memo() | Render perf | rerender-memo-strategy.md | | Server caching | Server response | server-cache-patterns.md |

Mejores prácticas de React de react.dev y Vercel. Úselo cuando: (1) Revisar el código de React, (2) Depurar problemas de rendimiento, (3) Optimizar el tamaño del paquete, (4) Escribir efectos o lógica de estado. Activadores de: rendimiento de React, re-renderizado, tamaño del paquete, cascadas, división de código, memo, useCallback, useMemo, useEffect, parpadeo SSR, carga inicial lenta, compilador React, estructura de estado, actualización inmutable, objeto de matriz setState. Fuente: ahonn/dotfiles.

Ver original