성능 원인 분류

성능 프로파일링 구간화

성능 문제는 감각으로 고치기 어렵습니다. 로딩, 스크립트 실행, 렌더링, 상호작용 지연을 분리해서 측정해야 합니다.

Load

초기 로딩

리소스 크기, 요청 수, 캐시 상태, 이미지 최적화를 확인합니다.

Script

JS 실행 비용

긴 작업, 불필요한 번들, 반복 계산이 메인 스레드를 막는지 봅니다.

Render

화면 그리기

layout, paint, compositing 비용이 반복해서 발생하는지 확인합니다.

UX

체감 지표

LCP, INP, CLS 같은 지표로 사용자가 느끼는 품질을 봅니다.