브라우저 작동방식

Q. 브라우저의 작동방식에 대해서 설명해 주세요.

 

A.

1. HTML, CSS, JS 등 렌더링에 필요한 리소스 요청과 서버로부터의 응답합니다.

2. 서버로부터 응답된 HTML과 CSS 파싱 > DOM, CSSOM 생성 > 결합하여 렌더 트리 생성합니다.

3. 서버로부터 응답된 JS를 파싱 > AST 생성 > 바이트 코드로 변환하여 실행합니다.

(이 때,  JS는 DOM API를 통해 DOM이나 CSSOM을 변경 가능, 변경된 DOM CSSOM 다시 렌더 트리로 결합)

4. 렌더트리를 기반으로 HTML 요소의 위치와 크기 (레이아웃)을 계산하고 브라우저 화면에 HTML요소를 페인팅한다.