웹 브라우저에 대해서.. Browser
웹 브라우저(일반적으로 브라우저
라고 함)는 월드 와이드 웹(World Wide Web - )의 정보에 접근하기 위한 소프트웨어 응용 프로그램
이다. 사용자가 특정 웹 사이트를 요청( request
)하면 웹 브라우저가 웹 서버에서 필요한 콘텐츠를 검색한 다음 사용자의 장치에 결과를 응답( response
)하여 표시한다.
🙄 Browser의 목적은 무엇일까?
웹 브라우저
의 목적은 웹에서 정보 리소스를 가져와 사용자의장치
에 표시하는 것이다.
이 프로세스는 사용자가 https://www.naver.com/
,과 같은 URL
( Uniform Resource Locator
) 주소를 브라우저에 입력하면 시작된다. 웹 페이지가 검색되면 브라우저의 렌더링 엔진
은 웹 페이지를 사용자의 장치에 표시한다. 여기에는 브라우저에서 지원하는 이미지 및 비디오 형식이 포함될 수 있다.
웹 페이지는 보통 다른 페이지와 자원에 대한 ( Hyperlink
)를 포함한다. 각 링크에는 URL
이 포함되어 있으며, 클릭하면 브라우저가 새 리소스로 이동한다. 따라서 사용자에게 컨텐츠를 가져오는 과정이 다시 시작된다.
기술적인 면에서는 1990년대 이후 브라우저가
HTML
,CSS
,Javascript
과 멀티미디어 기능을 크게 확장했다. 한 가지 이유는웹 애플리케이션
과 같이 더 정교한 웹사이트를 가능하게 하기 위해서였다. 또 다른 요인은 전화 접속 모뎀 (Dial-up modem
) 시대에는 불가능했던 스트리밍과 같은 데이터 집약적인 웹 콘텐츠에 접속할 수 있게 해주는 광대역(Broadband
) 접속의 현저한 증가다.
🤔 Browser는 어떻게 작동할까?
월드 와이드 웹
은 클라이언트-서버 모델
에서 작동한다. 클라이언트인 사용자 컴퓨터의 브라우저는 데이터를 서버로 요청-수신 하며 작동한다. 사용자가 웹 페이지를 요청하면 브라우저가 요청된 서버(웹 사이트가 저장된 위치)에 접속하여 요청된 파일을 가져오고 해석하여 컴퓨터 화면에 웹 페이지를 표시한다.
전체 과정은 다음과 같은 세 가지 단계에서 이루어진다.
#1. DNS 서버에 접속 (Domain Name System)
사용자가 주소 표시줄에 URL을 입력
하고 '입력' 또는 'Enter'키를 누르면, 브라우저에서 DNS 서버
에 접속한다. DNS 서버는 해당 도메인 이름
(예: https://www.google.com/
)과 연결된 서버의 IP 주소
(예: 192.168.1.4
)를 조회한다.
DNS 서버는 브라우저에서 도메인 이름을 가져와서 해당 IP 주소를 브라우저로
반환
한다.
#2. 서버 접속 (Server)
입력 된 웹페이지의 URL
은 DNS의 의해 도메인을 번역하여 서버의 IP 주소를 얻은 후, 브라우저는 해당 서버로 접속하여 페이지를 요청을 한다. 예를 들어: https://www.google.com/
-> 192.168.1.4
URL
은 3 부분으로 나뉜다:
- HTTP 또는 HTTPS — 이것은 브라우저가 서버와 통신하는 방법을 정의하는
Hyper Text Transfer Protocol
이라는 프로토콜이다. (https://
) - Adress — IP 주소로 DNS 서버에서 번역한
www.google.com
이다. 요청된 웹 페이지가 저장되는 컴퓨터(Web Server)의 주소다. - Request — 웹 사이트의
루트
또는 다른요쳥명
의 주소를 알려주는 '요청명'이다. (/
데체적으로HOME
페이지 요청이다)
#3. 렌더링 (Rendering)
- Load HTML — 브라우저에서 웹 페이지를 찾자마자 http 프로토콜을 사용하여 브라우저에 로딩된다. 모든 html 태그뿐만 아니라 html 태그에 언급된 다른 리소스(이미지, 플래시 파일, pdf 등)도 별도로 로드된다.
- Parsing —
HTML parser
는 html 파일을 해석하고 컨텐츠 트리를 작성한다. - Style — 웹 페이지에는 스타일 시트가 부착되어 있을 수 있으며 웹 브라우저에도 기본 스타일이 있다.
CSS parser
를 사용하여 html에 지정된 내용에 대한 스타일(높이, 너비, 간격, 테두리, 색상, 여백 등)을 정의하기 위해 해석한다. - Frame 구성 — HTML과 스타일시트를 사용하여 브라우저는 프레임을 만든다. 프레임은 너비, 높이, 색상, 간격 등과 같은 다양한 특성을 가진 직사각형 블록이다.
- Frame Layout — 이 프로세스에는 웹 페이지의 레이아웃을 만들기 위해 모든 프레임을 정렬하는 것이 포함된다.
🏆🇰🇷 대한민국 Browser
순위 (2020년 6월 기준)
Edit: 2020년 6월 기준으로 업데이트함
- 1위
Chrome
(69.54) - 2위
Internet Explorer
(14.08) - 3위
Whale
(4.4) 네이버의 브라우저 - 4위
Edge
(3.72) - 5위
Safari
(2.93) - 6위
Firefox
(1.41)
참고: Korea HTML5
Originally published at https://velog.io.