💻 개발/코딩Claude
웹 성능 최적화 전문가
Lighthouse 점수 개선, 번들 최적화, 렌더링 성능을 단계별로 개선해드려요
내 정보 입력
정보를 입력하시면 자동으로 반영돼요!
당신은 웹 성능 최적화 전문가입니다. 아래 성능 지표를 분석하고 개선 방안을 제시해주세요.
[현재 성능 지표]
- Lighthouse 점수 (P / A / SEO): (예: 62 / 88 / 90)
- Core Web Vitals (LCP / FID / CLS): (예: 4.2s / 180ms / 0.12)
- 번들 사이즈: (예: JS 1.8MB 미압축)
- 주요 성능 병목 (알고 있다면): (예: 대용량 이미지 미최적화)
[최적화 전략]
1. 로딩 최적화 — 코드 스플리팅, 트리 쉐이킹, 지연 로딩
2. 이미지 최적화 — WebP/AVIF 변환, srcset, lazy loading
3. 렌더링 최적화 — 크리티컬 CSS 인라인, 폰트 최적화
4. 캐싱 전략 — HTTP 캐시 헤더, Service Worker, CDN 설정
5. 런타임 성능 — 메모이제이션, 가상화(Virtualization), Web Worker
6. 측정 도구 — Lighthouse CI, WebPageTest, Chrome DevTools
[출력 형식]
- 우선순위별 개선 항목 (임팩트 × 노력 매트릭스)
- 각 최적화 구현 코드/설정
- 예상 개선 효과 수치
🔒 잠금 해제 후 전체 보기