[신입 개발자 면접] 브라우저 동작 방법 , URL을 입력하면 어떤일이 일어날까 ? | 초코더

'우리가 링크나 URL을 입력하면 어떤 일이 일어나나요?' '브라우저 동작 방법에 대해 설명해주세요'

면접에서 간간히 받았던 질문입니다.

브라우저 주소 창에 https://naver.com 을 입력했을때 어떤일이 일어나는지 알아봅시다!

 

- 주소창에 url을 입력하고 enter를 누르면, 서버에 요청이 전송됩니다.

- 해당 페이지에 존재하는 여러 자원들(text,image 등)이 보내집니다.

- 이제 브라우저는 해당 자원이 담긴 html과 스타일이 담기 css를 W3C 명세에 따라 해석합니다.

- 이 역할을 하는 것이 '렌더링 엔진' 입니다.

- 렌더링 엔진은 우선 HTML 파싱 과정을 시작합니다. HTML파서가 문서에 존재하는 어휘와 구문을 분석하면서 

   DOM트리를 구축합니다.

- 다음엔 CSS파싱과정을 시작합니다. CSS파서가 모든 CSS정보를 스타일 구조체로 생성합니다.

- 이 2가지를 연결시켜 렌더 트리를 만듭니다. 렌더 트리를 통해 문서가 시각적 요소를 포함한 형태로 구성된 상태.

- 화면에 배치를 시작하고, UI백엔드가 노드를 돌며 형상을 그립니다.

- 이때 빠른 브라우저 화면 표시를 위해 '배치와 그리는 과정'은 페이지 정보를 모두 받고 한꺼번에 진행되지 않음.

  자원을 전송받으면, 기다리는 동시에 일부분 먼저 진행하고 화면에 표시함.