브라우저의 렌더링 과정, 레이아웃과 리페인트
브라우저의 렌더링 과정 브라우저는 크게 네가지 단계를 거쳐 렌더링을 수행한다. 1. 요청 ✅ 브라우저가 서버에게 필요한 리소스를 요청하는 단계 2. 렌더트리 생성 ✅ HTML을 파싱하여 DOM Tree를, CSS를 파싱하여 CSSOM(CSS Object Model) Tree를 만든 후 두 트리를 조합하여 렌더트리를 구성한다. ✅ 렌더 트리는 화면에 나타나는 요소들을 결정하는 트리이다. → 어떤 요소들이 보여야하는지, 어떤 스타일이 적용되어야 하는지, 어떤 순서로 나타낼 것인지를 명세하는 트리이다. 3. 레이아웃(리플로우) ✅ 렌더 트리 구성이 끝나면 레이아웃 단계가 이어지는데, 이 단계에서는 렌더 트리에서 계산되지 않았던 노드들의 크기와 위치, 레이어 간 순서와 같은 정보를 계산하여 좌표에 나타낸다. ✅..
Programming/기타
2023. 7. 5. 21:11
