100%를 한번에 바꾸는건 어려워도 1%를 100번 바꾸는건 쉽다.

생각정리 자세히보기

개발/WEB

[WEB] 브라우저의 동작 방식

dc-choi 2020. 5. 9. 00:49
반응형

1. 브라우저의 기본구성

1. 사용자 인터페이스 : 브라우저 컴포런트라고도 부르며 주소 표시줄, 이전/다음 버튼, 북마크 메뉴 등

                             요청한 페이지를 보여주는 창을 제외한 나머지 모든 부분을 말한다.

 

2. 브라우저 엔진 : 핵심 엔진이며, 사용자 인터페이스와 렌더링 엔진 사이의 동작을 제어한다.

                        쿠키를 저장할때 이 계층에서 저장을 한다.

 

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

 

4. 통신 : HTTP 요청과 같은 네트워크 호출에 사용됨. 서버와 통신하기 위한 인터페이스이다.

 

5. UI 백엔드 : input 같은 기본적인 장치를 만든다. (textarea같은)

 

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

 

7. 자료 저장소 - 자료를 저장하는 계층이다. 쿠키를 저장하는 것과 같이 모든 종류의 자원을 하드 디스크에 저장한다.

2. 렌더링 엔진 상세설명

 

요청 받은 내용을 브라우저 화면에 표시하는 역할

렌더링 엔진은 HTML 및 XML 문서와 이미지를 표시할 수 있다.

1. HTML과 CSS를 파싱하여 DOM트리를 구축한다. (코드를 파싱하여 데이터를 구조화한다.)

 

2. 렌더트리를 구축한다. (데이터를 각각 순차적으로 표시한다.)

 

3. 렌더트리를 배치하고 그린다. (정확한 위치에 배치시키고 화면에 출력시킨다.)

반응형

'개발 > WEB' 카테고리의 다른 글

[WEB] HTTP는 무엇인가?  (0) 2020.05.26
[WEB] HTML tags  (0) 2020.05.14
[WEB] WAS란?  (0) 2020.05.06
[WEB] 웹 서버란?  (0) 2020.05.06