웹브라우저에서 렌더링은 어떤 과정으로 진행될까?

웹브라우저를 실행시키고 URL 값을 입력하고 엔터를 누르면, 아래와 같은 웹 통신 과정이 일어납니다.

1. DNS(Domain Name System) 조회

• 브라우저는 입력한 URL 값에서 도메인 이름을 추출한다.
• DNS 서버에 해당 도메인 이름을 IP 주소로 변경해 달라는 요청을 한다.
• DNS 서버는 해당 도메인 이름에 대한 IP 주소를 브라우저에 반환한다.
  - https://www.naver.com/ -> 125.209.222.141

2. TCP/IP 연결

• 브라우저는 해당 IP 주소로 TCP/IP 연결을 시도한다.
• 해당 서버와의 연결이 맺어지면, HTTP 요청을 보내기 위해 소켓을 만든다.

3. HTTP 요청 보내기

• 브라우저는 서버에 HTTP 요청 메시지를 보낸다.
• HTTP 요청 메시지는 HTTP 메서드(GET, POST, PUT, DELETE 등), 요청 URI, 요청 헤더, 요청 바디 등으로 구성된다.

4. 서버에서 응답 받기

• 서버는 브라우저에서 받은 요청을 처리한다.
• 처리한 결과에 대한 HTTP 응답 메시지를 브라우저에게 보낸다.
• HTTP 응답 메시지는 상태 코드, 응답 헤더, 응답 바디 등으로 구성된다.

5. HTML 문서 해석 및 렌더링

• 브라우저는 HTTP 응답 메시지에서 받은 HTML 문서를 해석하 DOM(Document Object Model) 트리로 변환한다.
• DOM 트리를 바탕으로 렌더링 엔진이 해당 문서를 화면에 출력한다.
• 렌더링 엔진은 CSS, JavaScript 등을 처리하여 최종적으로 화면에 보여지는 결과물을 만든다.

6. 연결 종료
   웹 페이지의 로딩이 완료되면, 브라우저는 해당 서버와의 TCP/IP 연결을 종료한다. 위와 같은 과정을 통해, 웹 브라우저에서 URL 값을 입력하고 엔터를 눌러 웹 페이지를 요청하고 응답받는 과정이 이루어진다.