FSD Frontend System Design

Part I β€” The Pipes

2 Communication

GoalChoose the right real-time transport for a given update frequency and direction.

  1. 2.1 Communication Overview Two questions decide everything: who starts the message, and how often does it arrive? 2Γ—2: update frequency vs direction Β· 11 min
  2. 2.2 Short Polling Ask the server every N seconds. Simple, stateless, and mostly wasted requests. Timeline: 6 requests, 1 carries data Β· 12 min
  3. 2.3 Long Polling The client asks, and the server holds the request open until it actually has news. Sequence with a held connection, vs short polling timeline Β· 13 min
  4. 2.4 Web Sockets One HTTP request upgrades into a persistent two-way pipe that stays open for the session. Upgrade handshake + duplex frames + reconnect state machine Β· 16 min
  5. 2.5 Server Side Events A one-way stream over ordinary HTTP that reconnects and resumes by itself. One-way event stream + the wire format + auto-resume Β· 14 min
  6. 2.6 WebHooks Server-to-server push: you register a URL, and the other system calls you when something happens. Polling vs webhook, plus the browser's last mile Β· 13 min
  7. 2.7 Picking a Transport Answer three questions in order β€” direction, frequency, tolerance for staleness β€” then defend the cost. Decision tree + cost table + one screen using four transports Β· 14 min

Capstone

Pick and justify a transport for each: stock ticker, chat, CI build log, order status, payment confirmation.