웹 브라우저(일반적으로 브라우저라고 함)는 월드 와이드 웹(World Wide Web - www)의 정보에 접근하기 위한 소프트웨어 응용 프로그램이다. 사용자가 특정 웹 사이트를 요청(request)하면 웹 브라우저가 웹 서버에서 필요한 콘텐츠를 검색한 다음 사용자의 장치에 결과를 응답(response)하여 표시한다.
🧐 wiki: History of the Web Browser
🙄 Browser의 목적은 무엇일까?
웹 브라우저의 목적은 웹에서 정보 리소스를 가져와 사용자의장치에 표시하는 것이다.
이 프로세스는 사용자가 https://www.naver.com/,과 같은 URL(Uniform Resource Locator) 주소를 브라우저에 입력하면 시작된다. 웹 페이지가 검색되면 브라우저의 렌더링 엔진은 웹 페이지를 사용자의 장치에 표시한다. 여기에는 브라우저에서 지원하는 이미지 및 비디오 형식이 포함될 수 있다.
웹 페이지는 보통 다른 페이지와 자원에 대한 하이퍼링크(Hyperlink)를 포함한다. 각 링크에는 URL이 포함되어 있으며, 클릭하면 브라우저가 새 리소스로 이동한다. 따라서 사용자에게 컨텐츠를 가져오는 과정이 다시 시작된다.
기술적인 면에서는 1990년대 이후 브라우저가
HTML,CSS,Javascript과 멀티미디어 기능을 크게 확장했다. 한 가지 이유는웹 애플리케이션과 같이 더 정교한 웹사이트를 가능하게 하기 위해서였다. 또 다른 요인은 전화 접속 모뎀 (Dial-up modem) 시대에는 불가능했던 Youtube 스트리밍과 같은 데이터 집약적인 웹 콘텐츠에 접속할 수 있게 해주는 광대역(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페이지 요청이다)
https://+www.google.com+/
#3. 렌더링 (Rendering)
- Load HTML – 브라우저에서 웹 페이지를 찾자마자 http 프로토콜을 사용하여 브라우저에 로딩된다. 모든 html 태그뿐만 아니라 html 태그에 언급된 다른 리소스(이미지, 플래시 파일, pdf 등)도 별도로 로드된다.
- Parsing –
HTML parser는 html 파일을 해석하고 컨텐츠 트리를 작성한다. - Style – 웹 페이지에는 스타일 시트가 부착되어 있을 수 있으며 웹 브라우저에도 기본 스타일이 있다.
CSS parser를 사용하여 html에 지정된 내용에 대한 스타일(높이, 너비, 간격, 테두리, 색상, 여백 등)을 정의하기 위해 해석한다. - Frame 구성 – HTML과 스타일시트를 사용하여 브라우저는 프레임을 만든다. 프레임은 너비, 높이, 색상, 간격 등과 같은 다양한 특성을 가진 직사각형 블록이다.
- Frame Layout – 이 프로세스에는 웹 페이지의 레이아웃을 만들기 위해 모든 프레임을 정렬하는 것이 포함된다.
🏆🇰🇷 대한민국 Browser 순위 (2019년 8월 기준)
- 1위
Chrome(69.5) - 2위
Internet Explorer(17.63) - 3위
Edge(4.14) - 4위
Safari(2.7) - 5위
Whale(2.08) 네이버의 브라우저 Firefox,Opera, 등등
참고: Korea HTML5
