TIL
Reflow와 Repaint 차이
브라우저 렌더링 과정(요약) DOM + CSSOM 웹 브라우저 화면을 그리는데 필요한 리소스(HTML, CSS)를 다운로드 하여 브라우저가 이해할 수 있는 형태(관계 트리)로 변환하는 과정 레이아웃 화면 구성 요소의 위차나 크기를 계산하고, 해당 위치에 요소를 배치하는 과정 페인트 화면에 배치된 요소에 색을 채워 넣는 과정(이때, 레이어를 분리해서 작업) 컴포지트 페인트 단계에서 쪼개 놓는 레이어를 합치는 과정 Reflow 브라우저 렌더링 을 재 실행하는 과정 CSSOM과 레이아웃을 재설정 해야 하는 상황일 때, 브라우저 랜더링 주요 과정이 재 실행 리플로우 발생시키는 CSS 속성 position, display, width, float, height, font-family, top, left, font-size, font-weight, line-height, margin, padding, border 등 Repaint 브라우저 렌더링 과정 중 를 재 실행하는 과정 CSSOM만…