본문 바로가기
JS

브라우저 대기 시간 Latency

by 사과넹 2024. 4. 15.
반응형

정의

하나의 데이터 패킷이 출발지에서 도착지까지 가는 데 걸리는 시간

대기 시간은 첫 번째 패킷을 받아올 때는 긴 편이다. 첫 번째 패킷의 크기가 14kb로 정해져 있다하더라도 DNS 조회, TLS handshake, TCP negotiation 과정을 거친 후 요청한 패킷을 받아오기 때문이다. 이후에는 이미 네트워크가 연결 되었으니 이러한 과정은 생략된다.

대기시간 측정 방법

브라우저가 자원 요청을 보내는 시간 또는 브라우저가 요청을 보내고, 다시 응답오는 왕복 시간을 측정한다.

  • Network latency
    • 브라우저 요청→ 서버 응답 → 브라우저 해당 자원의 흐름 대기시간
  • Disk latency
    • 서버 응답 → 브라우저 해당 자원의 흐름 대기시간

브라우저를 이용해서 다양한 네트워크 상태에서 테스트를 할 수 있는데, 이를 Network Throttling(네트워트 조절)이라고 부른다. 브라우저 개발자도구를 통해 저대역폭 네트워크로 연결하여 해당 환경을 테스트할 수 있다.

네트워크 통신시 다양한 시간 단위

blocked

요청이 대기열에 있는 상태이다. 동시에 많은 HTTP 연결을 맺으려 할 때 발생하며 다른 연결이 해제될 때까지 자원을 다운로드 할 수 없다. 브라우저는 비교적 동기적으로 작동한다.

DNS resolution

DNS lookup을 수행하는데 소요되는 시간이다.

DNS lookup DNS record 조회를 일컫는다.

Connecting

TCP handshake를 완료하는데 소요되는 시간이다.

TLS handshake

TLS negotiation을 수행하는데 소요되는 시간이다.

Sending

HTTP요청을 서버로 전송하는데 소요되는 시간이다.

Waiting

디스크 대기 시간으로, 서버가 응답을 완료하는데 소요되는 시간이다.

Receiving

자원을 다운로드 받는데 소요되는 시간이다. 자원 파일 크기에 따라 결정되며 캐싱 여부가 속도에 영향을 미친다.

ref

728x90
반응형