Ray Book

네트워크와 브라우저 통신

URL 입력부터 응답까지, HTTP, fetch, CORS, 캐싱, WebSocket을 시각화합니다

  1. 01

    HTTP 요청의 흐름

    URL을 입력하면 무슨 일이 벌어질까, DNS, TCP, TLS, HTTP의 전체 파이프라인을 시각화합니다

  2. 02

    fetch API와 요청 제어

    JavaScript에서 HTTP 요청을 보내는 fetch API, Request, Response, Headers, AbortController를 시각화합니다

  3. 03

    CORS의 동작 원리

    왜 다른 도메인 요청이 차단될까, Same-Origin Policy와 CORS preflight를 시각화합니다

  4. 04

    캐싱 전략

    Cache-Control, ETag, Service Worker, 네트워크 요청을 줄이는 브라우저 캐싱 메커니즘을 시각화합니다

  5. 05

    실시간 통신: WebSocket과 SSE

    Polling, Server-Sent Events, WebSocket, 세 가지 실시간 통신 방식을 비교하고 시각화합니다