웹/브라우저1 Critical Rendering Path CRP를 보기전에 DOM, CSSOM, Render Tree에 대해 간단히 봅시다. DOM이란? Document Object Model로 HTML 파일을 브라우저에서 읽게 되면 태그들을 분석해서 자바스크립트 Node라는 Object로 변환 됩니다. 이것을 통해 웹페이지의 요소들을 선택하고, 조작하고 변경을 할 수 있는 겁니다. CSSOM이란? DOM + CSS로 DOM과 우리가 정의한 CSS 파일을 파싱하여 합친것을 말합니다. 마지막 Render Tree란? 이렇게 만들어진 DOM과 CSSOM을 합친 것으로 최종적으로 렌더링 될 노드들만 나타나 있습니다. 만약 display:none인 아이는 여기에 포함이 되질 않습니다. 그래서 렌더링은 어떻게 되는데? 웹페이지를 요청하면 아래 그림과 같은 과정을 거쳐서.. 2023. 3. 10. 이전 1 다음