재현
느린 입력이나 목록 조작을 같은 순서로 반복합니다.
React · profiler
Profiler 기반 성능 진단 루프
느린 화면을 추측으로 고치지 않고, 렌더 기록을 보고 병목 컴포넌트를 좁혀 가는 절차입니다.
진단에서 수정까지
perfProfiler 기록
커밋별 렌더 시간과 다시 렌더된 컴포넌트를 봅니다.
원인 분류
props 변경, context 변경, 부모 렌더를 나눠 봅니다.
최적화 적용
memoization이나 컴포넌트 분리로 범위를 줄입니다.
재측정
개선 전후를 같은 조건에서 비교합니다.
reproduce
→
record
→
inspect
→
optimize
→
measure again
Profiler 기반 성능 진단 루프 정리
성능 개선은 도구로 병목을 찾고, 가장 작은 변경으로 효과가 있는지 되돌아보는 반복 작업입니다.