브라우저 렌더링 원리

Browser란?

사용자가 참조하고 싶은 웹페이지를 서버에 요청(URL)하고, 서버의 응답을 받아 브라우저에 보여주는 것

 

브라우저 렌더링 원리를 설명하시오

1. Load HTML/CSS -> Parse HTML/CSS -> Create Dom/Cssom Tree -> Render Tree생성 -> Layout단계 -> Paint

브라우저는 네트워크 통신으로 HTML 문서를 받아옵니다.
그리고 파싱을 진행한 후 이를 바탕으로 DOM Tree를 만듭니다.
DOM Tree는 이후 CSSOM Tree와 합쳐져 렌더트리(Render Tree)를 만들게 됩니다.
렌더 트리를 만든 이후 레이아웃(Layout)과 페인트(Paint)라는 추가 작업을 거치게 됩니다.

(Load - Html / css 파일을 불러온다/내려받는다)

(문서 파싱 - 브라우저가 코드를 이해하고 사용할 수 있는 구조로 변환하는 것을 의미)

(Object Model - Dom/Cssom 트리로 만드는 것)