개발자 Saaad

[웹개발] DOM 본문

학습/kakao X goorm 풀스택12회차

[웹개발] DOM

Saaad 2024. 11. 27. 11:35

HTML 을 이용한 화면 UI 표현

브라우저에서 UI를 볼 수 있는 것은 이 HTML을 분석해서 보여주는 것입니다.

이 HTML은 요소(element)로 구성되어 있습니다.

 


DOM 이란 ? (Document Object Model)

DOM(문서 객체 모델)은 메모리에 웹 페이지 문서 구조를 트리구조로 표현해서

웹 브라우저가 HTML 페이지를 인식하게 해줍니다.

또한 위에서 보는 웹 페이지를 이루는 요소들을 자바스크립트가 이용할 수 있게끔 브라우저가

트리구조로 만든 객체 모델을 의미합니다.

HTML 문서를 트리구조로 표현


웹 페이지 빌드 과정 (Critical Render Path : CRP)

브라우저가 서버에서 페이지에 대한 HTML 응답을 받고 화면에 표시하기 전에 여러 단계가 있습니다.

웹 브라우저가 HTML 문서를 읽고, 스타일을 입히고 뷰포트에 표시하는 과정을 나타냅니다.

HTMl 문서를 화면에 띄우는 과정의 단순화
CRP(Critical Render Path)