[HTTP] 브라우저 렌더링 과정

 

🔗 Browser Rendering(브라우저 렌더링)이란?

 

 사용자의 요청을 서버에 전달하고 그 결과를 화면에 나타내는 과정을 의미한다.

 

 

🔗 Parsing(파싱)이란?

 

 브라우저가 코드를 이해하고 사용할 수 있는 구조로 변화하는 것을 의미한다.

 

 

🔗 DOM(돔)이란?

 

DOM(돔)이란? Virtual DOM(가상 돔)이란?

 

🔗 브라우저 렌더링 과정

 

 

 

① HTML 파서에 HTML 코드가 들어오면, 이것을 파싱하여 DOM 트리를 생성한다.

② CSS 파서에 CSS 코드가 들어오면,  이것을 파싱하여 CSSOM 트리(스타일 규칙)를 생성한다.

③ 완성된 DOM 트리와 CSSOM 트리(스타일 규칙)를 합쳐 Render 트리를 만든다.

④ 완성된 Render 트리를 바탕으로 레이아웃을 잡고, 화면에 그리는 작업을 수행해 사용자에게 웹 페이지의 최종 결과를 보여준다.

 

---

🔎 참고 자료

• 브라우저는 어떻게 동작하는가?
• IT 기술 면접 예상 문제

💡 같이 보면 좋을 Post

[HTTP] HTTP 프로토콜이란?

DOM(돔)이란? Virtual DOM(가상 돔)이란?