▶ Interactive Lab

WebSocket Frame Flow

Animate frames flowing between client and server.

Advertisement
WebSocket is full-duplex. Either side can send any time after handshake.

What you're seeing

After the HTTP upgrade handshake, WebSocket is a long-lived bidirectional connection. Frames have a small (2-14 byte) header: opcode, masking, length, payload.

Used for chat, live updates, multiplayer games. Browsers automatically mask client→server frames (security against proxy injection). Servers don't mask.

★ KEY TAKEAWAY
WebSocket is full-duplex. Either side sends frames at any time. Browsers mask client→server frames.
▶ WHAT TO TRY
  • Click Client → Server and Server → Client in any order.
  • Both directions are independent — frames can cross.