모던 자바스크립트 38장 브라우저의 렌더링 과정

연호·2023년 1월 11일
0

모던자바스크립트

목록 보기
28/28

브라우저의 렌더링 과정

  1. 파싱이란 프로그래밍 언어의 문법에 맞게 작성된 텍스트 문서를 읽어 들여 실행하기 위해 텍스트 문서의 문자열을 토큰으로 분해하고 토큰에 문법적 의미와 구조를 반영하여 트리구조의 자료구조인 파스트리를 생성하는 일련의 과정을 말한다.

  2. 렌더링이란 HTML, CSS, JS로 작성된 문서를 파싱하여 브라우저에 시각적으로 출력하는 것을 말한다.

  3. 브라우저의 핵심 기능은 필요한 리소스 (HTML, CSS, JS, 이미지, 폰트 등)을 서버에 요청하고 서버로부터 응답받아 브라우저에 시각적으로 렌더링하는 것이다.

  4. 브라우저의 렌더링 엔진은 응답받은 HTML 문서를 파싱하여 브라우저가 이해할 수 있는 자료구조인 DOM을 생성한다. 즉 DOM은 HTML 문서를 파싱한 결과물이다.

  5. CSS는 HTML과 동일한 파싱 과정을 거치고 해석하여 CSSOM을 생성한다.

  6. 랜더 트리란 트리 구조의 자료구조이며 HTML과 CSS를 파싱하여 생성한 각각의 DOM과 CSSOM을 렌더링하기 위해 랜더트리로 결합된다.

profile
뉴비

0개의 댓글