[CS] 네트워크 요청 처리 과정 (feat.TTFB)

팔랑이·2025년 2월 25일
0

CS

목록 보기
16/19

⛳️ 인프런 - cs 지식의 정석 강의를 듣고 학습한 내용입니다.


www.naver.com 입력 시 일어나는 일들

개요

브라우저에 www.naver.com을 입력하면 여러 단계를 거쳐 화면이 나타난다. 이 과정에는 리다이렉트, 캐싱, DNS 조회, IP 라우팅 및 ARP, TCP 연결, 요청 및 응답 처리, 콘텐츠 다운로드, 브라우저 렌더링이 포함된다.

전체 과정 요약: TTFB 기준으로

1. 리다이렉트

  • 요청 URL이 리다이렉트를 요구하면 서버가 새로운 URL로 이동시킨다.
  • 리다이렉트가 없으면 다음 과정으로 진행한다.

2. 캐싱 확인

  • 브라우저나 프록시 서버에서 캐싱된 데이터가 있는지 확인한다.
  • 캐시가 있으면 요청을 서버로 전송하지 않고 캐시된 데이터를 반환한다.
  • 캐시가 없으면 DNS 요청으로 넘어간다.

캐시의 종류

브라우저 캐시 (Private Cache)

  • 쿠키, 로컬스토리지 등 개인 전용 캐시
  • 이전에 방문한 페이지의 데이터를 저장해 빠른 로딩 제공

공유 캐시 (Public Cache)

  • 프록시 서버나 CDN 서버가 데이터를 저장
  • 여러 사용자에게 동일한 데이터를 빠르게 전달
  • 예시: Nginx 프록시 서버, AWS CloudFront, Cloudflare 등

3. DNS 조회

: 도메인 이름(FQDN)을 IP 주소로 변환한다.

계층적 DNS 서버 순서

  • Root DNS → TLD DNS (.com 등) → 도메인 DNS (naver.com) → 서브도메인 DNS (www)

DNS 캐싱

  • 브라우저 캐시: chrome://net-internals/#dns에서 확인
  • OS 캐시: Windows에서 ipconfig /displaydns 명령어로 확인 가능

4. IP 라우팅 및 ARP

  • DNS에서 받은 IP를 기반으로 네트워크 경로를 찾는다.
  • ARP(Address Resolution Protocol)를 통해 IP를 MAC 주소로 변환해 실제 서버로 전달한다.

5. TCP 연결 구축

  • TCP 3-way 핸드셰이크로 연결을 설정한다.
  • HTTPS인 경우 SSL/TLS 핸드셰이크가 추가된다.
  • HTTP/1.1, HTTP/2에서는 TCP 연결을 사용하며, HTTP/3부터는 QUIC 프로토콜로 대체된다.

6. 요청 전송 및 응답 수신 (TTFB)

  • 클라이언트가 서버로 요청을 보내고 서버는 응답을 준비한다.
  • 첫 번째 바이트가 도착하는 시간(TTFB)이 측정된다.

7. 콘텐츠 다운로드

  • 서버에서 HTML, CSS, JS, 이미지 등의 데이터를 전송한다.
  • 병렬 다운로드가 가능하며 캐싱된 리소스는 제외된다.

8. 브라우저 렌더링

  • 받은 HTML을 파싱해 DOM 트리를 생성한다.
  • CSS 파싱 후 스타일 적용을 위한 CSSOM 트리를 만든다.
  • DOM과 CSSOM을 합쳐 렌더 트리를 생성 후 레이아웃 계산 및 페인팅을 진행한다.
profile
정체되지 않는 성장

0개의 댓글