브라우저의 작동방식

wkdtmddus·2023년 8월 6일

브라우저는 웹 페이지를 로드하고 표시하는 역할을 담당하는 소프트웨어입니다.
브라우저는 사용자가 주소창에 URL을 입력하거나 링크를 클릭하는 등의 동작으로 웹 페이지를 요청하고, 서버로부터 받은 HTML, CSS, JavaScript 등의 리소스를 해석하여 화면에 표시합니다.
브라우저의 작동 방식은 크게 다음과 같은 단계로 이루어집니다.

사용자 입력 및 주소창에 URL 입력 :

사용자가 웹 브라우저를 실행하고 주소창에 URL을 입력하면, 브라우저는 해당 URL에 대한 요청을 생성합니다.
URL 해석과 DNS 조회 :

브라우저는 입력받은 URL을 해석하여 호스트(HOST) 이름과 포트(PORT) 번호 등을 추출합니다.
이후, DNS(Domain Name System) 서버에 호스트 이름을 전송하여 IP 주소로 변환하는 과정인 DNS 조회를 수행합니다.
서버 연결 및 요청 전송 :

브라우저는 DNS 조회 결과를 바탕으로 해당 서버의 IP 주소로 연결을 시도합니다.
TCP/IP 프로토콜을 사용하여 웹 서버와 안전한 연결인 HTTPS의 경우 SSL/TLS 핸드셰이크를 거쳐 보안 연결을 설정합니다.
이후, HTTP 요청 메시지를 생성하여 서버로 전송합니다.
서버 응답 및 리소스 다운로드 :

웹 서버는 브라우저의 요청을 받고, 요청된 리소스(HTML, CSS, JavaScript, 이미지 등)를 포함한 HTTP 응답 메시지를 생성하여 클라이언트(브라우저)로 전송합니다.
리소스 처리 및 렌더링 :

브라우저는 받은 HTTP 응답을 받아서 리소스들을 해석하고 처리합니다.
HTML 문서를 파싱하여 DOM(Document Object Model)을 생성하고, CSS 스타일 시트를 해석하여 DOM 요소들에 스타일을 적용합니다.
JavaScript 코드를 실행하여 동적인 기능을 추가하고, 페이지에 반영합니다.
페이지 렌더링과 레이아웃 :

브라우저는 DOM 요소들과 스타일 정보를 사용하여 페이지를 렌더링하고 레이아웃을 구성합니다.
이 과정에서 뷰포트(Viewport)와 같은 요소가 고려되며, 화면에 어떻게 보여질지 계산됩니다.
화면에 출력 :

최종적으로 렌더링된 페이지가 브라우저 화면에 출력됩니다.
사용자는 이제 페이지를 볼 수 있고, 상호작용할 수 있습니다.
사용자 상호작용 및 이벤트 처리 :

사용자가 페이지와 상호작용하는 경우, 브라우저는 이벤트를 감지하고 적절한 처리를 수행합니다.
이벤트는 클릭, 키 입력, 마우스 움직임 등 다양한 형태로 발생할 수 있습니다.
탐색과 페이지 이동 :

사용자가 다른 링크를 클릭하거나 주소창에 다른 URL을 입력하는 등으로 새로운 페이지로 이동하는 경우, 위 단계를 반복하여 새로운 페이지를 가져와서 렌더링합니다.