# [[Render Tree]] ## 📌 Brief Summary 렌더 트리(Render Tree)는 웹 브라우저의 렌더링 과정에서 DOM(문서 객체 모델)과 CSSOM(CSS 객체 모델)이 결합하여 만들어지는 구조입니다 [1-3]. 이 트리는 화면에 시각적으로 출력되어야 하는 노드들과 해당 노드들의 계산된 스타일 정보만을 포함합니다 [3-5]. 완성된 렌더 트리는 이후 화면에서 각 요소의 정확한 위치와 크기를 계산하는 레이아웃(Layout) 단계와 실제 픽셀을 그리는 페인트(Paint) 단계의 핵심 입력 데이터로 사용됩니다 [1, 6, 7]. ## 📖 Core Content * **생성 과정:** 브라우저는 DOM 트리의 루트에서부터 시작하여 화면에 표시되는(visible) 각 노드를 순회하며 렌더 트리를 구성합니다 [3, 5, 8]. 화면에 표시되는 각각의 노드에 대해 브라우저는 CSSOM에서 일치하는 적절한 규칙을 찾아 적용하며, 최종적으로 콘텐츠와 계산된 스타일을 함께 포함하는 렌더 트리를 완성합니다 [4, 5]. * **포함 및 제외 요소의 기준:** 렌더 트리는 시각적 레이아웃에 영향을 미치는 요소들만 포함합니다 [1]. 따라서 ``, `