프론트엔드
웹 성능 최적화 - 렌더링 최적화
두줄요약
웹 성능 최적화를 렌더링과 로딩으로 나누고, 이번 글에서는 애니메이션 최적화에 초점을 맞추었습니다. Reflow와 Repaint 개념을 정리한 뒤 transform 활용과 Performance 탭 측정 결과를 비교했습니다.
웹 성능 최적화를 렌더링과 로딩으로 나누고, 이번 글에서는 애니메이션 최적화에 초점을 맞추었습니다. Reflow와 Repaint 개념을 정리한 뒤 transform 활용과 Performance 탭 측정 결과를 비교했습니다.
#성능 주제를 이어서 읽기
브라우저 렌더링 경로와 Reflow·Repaint가 애니메이션 성능에 미치는 영향을 설명했습니다. 사운드 미터 비교를 통해 transform 기반 구현의 Layout 비용 감소를 확인했습니다.
