Frontend performance optimization with data-driven approach. Use when optimizing page load times, improving Web Vitals, or when user mentions performance, Web Vitals, LCP, FID, CLS, パフォーマンス最適化, 速度改善, bundle size.
View on GitHubthkt/claude-config
development-skills
January 22, 2026
Select agents to install to:
npx add-skill https://github.com/thkt/claude-config/blob/main/skills/optimizing-performance/SKILL.md -a claude-code --skill optimizing-performanceInstallation paths:
.claude/skills/optimizing-performance/# Performance Optimization ## Core Web Vitals | Metric | Target | Measure | | ------ | ------ | ------------------------ | | LCP | <2.5s | Largest Contentful Paint | | FID | <100ms | First Input Delay | | CLS | <0.1 | Cumulative Layout Shift | ## Workflow 1. Measure (Lighthouse/DevTools) 2. Identify bottleneck 3. One change at a time 4. Re-measure ## References | Topic | File | | ------ | ----------------------------------- | | Vitals | `references/web-vitals.md` | | React | `references/react-optimization.md` | | Bundle | `references/bundle-optimization.md` |