웹 개발자에게 HTTP 요청은 대체로 한 줄의 코드다. fetch를 부르거나 브라우저 주소창에 주소를 입력하면, 잠시 뒤 결과가 화면에 나타난다. 그 사이에 무슨 일이 벌어지는지는 대부분 추상화 뒤로 숨는다. '200 Milliseconds'는 바로 그 감춰진 구간을 정면으로 드러내는 인터랙티브 웹 실험이다. 카페에서 누군가 버튼을 클릭하는 순간부터 DNS 조회, TCP 연결, TLS 핸드셰이크, 커널, Node.js의 이벤트 루프, 그리고 Postgres 데이터베이스를 거쳐 다시 픽셀로 그려지기까지—단 하나의 요청이 살아 움직이는 전 과정을 시간 축을 따라 보여준다. 전체 소요 시간은 211밀리초. 사용자가 스크롤을 움직일 때에만 시간이 흐른다는 점이 이 작업의 핵심 장치다.
눈 깜짝할 시간을 늘려 보는 일
211밀리초는 사람이 인지하기 어려운 찰나다. 그러나 CPU와 네트워크 장비의 관점에서 이 시간은 수많은 단계가 순차적, 혹은 병렬적으로 겹쳐 일어나는 긴 여정이다. 이 프로젝트가 택한 방식은 시간을 사용자의 스크롤 속도에 묶어 두는 것이다. 스크롤을 멈추면 시간도 멈추고, 천천히 내리면 각 구간을 원하는 만큼 오래 들여다볼 수 있다. 실시간이라는 표현을 쓰면서도 실제로는 관찰자가 시간의 흐름을 직접 제어하도록 설계해, 평소 계측 도구의 숫자로만 접하던 지연(latency)을 감각적인 경험으로 바꿔 놓는다.
표면적으로는 시각화 장난감처럼 보이지만, 다루는 구간은 실무의 성능 논의에서 매번 등장하는 바로 그 지점들이다. DNS 조회가 캐시 미스로 느려지거나, TLS 핸드셰이크의 왕복이 모바일 환경에서 체감 지연을 키우거나, 이벤트 루프가 블로킹되어 요청이 큐에 밀리거나, 데이터베이스 쿼리 한 방이 응답 시간의 대부분을 잡아먹는 상황은 실제 장애와 튜닝의 단골 주제다. 이 작업은 그 단계들을 하나의 타임라인 위에 순서대로 배치함으로써, 흩어져 있던 지식을 연결된 지도로 다시 보게 한다.
멘탈 모델을 다시 그리는 도구
한국의 백엔드·인프라 실무자에게 이 실험의 실질적 가치는 '멘탈 모델의 재정렬'에 있다. 우리는 APM 대시보드에서 응답 시간을 밀리초 단위로 관찰하고, 트레이싱 도구로 스팬(span)을 나눠 본다. 하지만 각 스팬이 물리적으로 커널의 어느 지점, 런타임의 어느 단계에 대응하는지를 직관적으로 떠올리는 사람은 많지 않다. 클라이언트 클릭부터 커널과 이벤트 루프, DB까지 이어지는 이 서사는 분산 추적의 각 구간이 실제로 무엇을 기다리고 있는지를 몸으로 이해하도록 돕는다. 신입 엔지니어 교육 자료나 온보딩용 참고 자료로도 충분히 활용할 만하다.
특히 Node.js 스택을 쓰는 팀이라면 이벤트 루프가 이 여정의 한 축으로 명시적으로 등장한다는 점이 눈에 띈다. 싱글 스레드 논블로킹 모델에서 하나의 요청이 커널의 소켓 이벤트를 받아 콜백으로 처리되고, DB 응답을 기다리는 동안 다른 일을 처리하다가 다시 돌아오는 흐름은 말로 설명하기 까다롭다. 시간의 흐름을 눈으로 따라가며 이 구조를 확인하는 경험은, 문서 열 페이지보다 오래 기억에 남을 가능성이 크다.
하나의 이상적 경로라는 한계
다만 이런 종류의 시각화가 갖는 구조적 한계도 분명히 짚어 둘 필요가 있다. 이 작업은 특정한 하나의 요청, 그것도 비교적 매끄럽게 성공하는 이상적 경로를 보여 준다. 현실의 프로덕션에서는 CDN과 캐시 계층, 로드 밸런서, 연결 재사용(keep-alive), 재시도와 타임아웃, 패킷 손실과 재전송, 그리고 콜드 스타트 같은 변수가 겹겹이 끼어든다. 211밀리초라는 숫자 역시 특정 조건에서의 한 사례일 뿐, 지역·네트워크·부하에 따라 얼마든지 달라진다. 이 실험을 성능의 절대적 기준표로 받아들이기보다, 요청의 골격을 이해하는 출발점으로 삼는 편이 온당하다.
결국 '200 Milliseconds'가 제안하는 것은 정답이 아니라 관점이다. 매일 수백만 번씩 무심코 흘려보내는 요청 하나에도 DNS부터 데이터베이스까지 여러 계층의 협업이 촘촘히 얽혀 있다는 사실을, 스크롤이라는 가장 단순한 동작으로 되새기게 한다. 지연을 줄이는 실무는 결국 이 여정의 어느 구간에서 시간이 새는지를 정확히 짚는 데서 시작한다. 그런 의미에서 이 작은 웹 실험은, 우리가 매일 다루면서도 좀처럼 온전히 들여다보지 않는 대상을 잠시 멈춰 세워 관찰하게 만드는 흔치 않은 자료다.