[dreamhack] Stage 2: Web Browser

웹브라우저

:뛰어난 이용자 경험(User eXperience, UX)을 제공하는 소프트웨어 중 하나

 

이용자가 주소창에 특정 주소를 입력했을 때 웹 브라우저가 하게 되는 기본적인 동작

1. 웹 브라우저의 주소창에 입력된 주소를 해석 (URL 분석)
2. 해당하는 주소 탐색 (DNS 요청)
3. ...
4. HTTP를 통해 입력 주소에 요청
5. 입력 주소의 HTTP 응답 수신
6. 리소스 다운로드 및 웹 렌더링 (HTML, CSS, Javascript)

 

URL(Uniform Resource Locator)

: 웹에 있는 리소스의 위치를 표현하는 문자열

: Scheme, Authority (Userinfo, Host, Port), Path, Query, Fragment 등으로 구성

 

 

Host

:웹 브라우저가 접속할 웹 서버의 주소

: Domain Name, IP Address의 값을 가질 수 있음

 

 

IP Address

: 네트워크상에서 통신이 이루어질 때 장치를 식별하기 위해 사용되는 주소

: 불규칙한 숫자로 이뤄져 외우기 어려우므로 일반적으로는 도메인의 특성을 담은 이름을 정의하여 IP 대신 사용

 

 

웹 렌더링(Web Rendering)

: 서버로부터 받은 리소스를 이용자에게 시각화하는 행위

: 서버의 응답을 받은 웹 브라우저는 리소스의 타입을 확인하고, 적절한 방식으로 이용자에게 전달

ex. 서버로부터 HTML과 CSS를 받으면 브라우저는 HTML을 파싱하고 CSS를 적용하여 이용자에게 보여줌

: 웹 렌더링 엔진에 의해 이루어짐--> 브라우저별로 서로 다른 엔진을 사용

- 사파리 = 웹킷(Webkit),

- 크롬 = 블링크(Blink)

- 파이어폭스 = 개코(Gecko) 엔진을 사용

 

=> 웹 페이지의 문제점을 찾기 위해서는 브라우저의 역할에 대해 자세히 알고 있어야 함!