브라우저 기본 구조

1. 사용자 인터페이스
   주소 표시줄, 이전/다음 버튼, 북마크 메뉴 등.
   요청한 페이지를 보여주는 창을 제외한 나머지 모든 부분.

2. 브라우저 엔진
   사용자 인터페이스와 렌더링 엔진 사이의 동작을 제어

3. 렌더링 엔진
   요청한 콘텐츠를 표시.
   예를들어 HTML을 요청하면 HTML과 CSS를 파싱하여 화면에 표시함.

4. 통신
   HTTP 요청과 같은 네트워크 호출에 사용됨.
   이것은 플랫폼 독립적인 인터페이스이고 각 플랫폼 하부에서 실행됨

5. UI 백엔드
   콤보 박스와 창 같은 기본적인 장치를 그림.
   플랫폼에서 명시하지 않은 일반적인 인터페이스로서, OS 사용자 인터페이스 체계를 사용.

6. 자바스크립트 해석기
   자바스크립트 코드를 해석하고 실행

7. 자료 저장소
   이 부분은 자료를 저장하는 계층이다.
   쿠키를 저장하는 것과 같이 모든 종류의 자원을 하드 디스크에 저장할 필요가 있다. HTML5 명세에는 브라우저가 지원하는 웹 데이터 베이스가 정의되어 있다.

렌더링 엔진들

파이어폭스와 크롬, 사파리는 두 종류의 렌더링 엔진으로 제작되었다. 파이어폭스는 모질라에서 직접 만든 게코엔진을 ㅏㅅ용하고 사파리와 크롬은 웹킷 엔진을 사용한다.

렌더링 엔진의 시작

통신으로부터 요청한 문서의 내용을 얻는 것으로 문서의 내용은 보통 8kb 단위로 전송 된다.

렌더링 엔진 동작 과정

HTML 파싱 -> 렌더트리 구축 -> 렌더트리 배치 -> 렌더트리 그리기의 과정을 점진적으로 수행한다.
렌더링 엔진은 HTML을 파싱할 때까지 기다리지 않고 배치와 그리기 과정을 시작한다. 네트워크로부터 나머지 내용이 전송되기를 기다리는 동시에 받은 내용의 일부를 먼저 화면에 표시하는 것.