Optimizes frontend performance using a data-driven approach focused on Web Vitals and React efficiency.
This skill empowers Claude to identify and resolve performance bottlenecks in frontend applications through a rigorous measurement-first methodology. It provides specialized guidance for optimizing Core Web Vitals (LCP, FID, CLS), streamlining React component rendering via memoization, and reducing bundle sizes through code splitting and tree shaking. By integrating with Chrome DevTools and MDN references, it ensures that every optimization is backed by empirical data rather than guesswork, helping developers achieve faster load times and smoother user experiences.
Características Principales
01React-specific rendering improvements using memo, useMemo, and useCallback
02Systematic measurement and verification workflow for performance regression testing
03Comprehensive Core Web Vitals optimization for LCP, FID, and CLS
043 GitHub stars
05Bundle size reduction through effective code splitting and tree shaking
06Data-driven bottleneck identification using Lighthouse and Chrome DevTools
Casos de Uso
01Optimizing large JavaScript bundles to improve Time to Interactive (TTI)
02Diagnosing and fixing slow page loads or low Lighthouse performance scores
03Reducing unnecessary re-renders in complex React component trees
