브라우저 출력 과정
-
브라우저는 HTML, CSS, JS, 이미지, 폰트 등 리소스를 서버에 요청하고, 응답으로 받아온다.
-
브라우저 렌더링 엔진은 받아온 HTML, CSS를 파싱해 DOM, CSSOM을 생성하고, 이들을 결합해 렌더 트리를 생성한다.
-
Dom -> <body> <div>
…
-
cssdom -> < link > < style > …
-
브라우저 JS 엔진은 받아온 JS를 파싱해 AST를 생성하고, 바이트코드로 변환해 실행한다.
-
렌더트리를 기반으로 HTML 요소의 레이아웃(위치, 크기)을 계산한다.
-
화면에 HTML요소를 페인팅한다.