Amr Samir | Real-Time WhatsApp System Design & WebSockets

1. The Real-Time Messaging Challenge

A real-time messaging platform like WhatsApp handles billions of messages daily with requirements for sub-second latency, offline queueing, delivery status receipts (Sent, Delivered, Read), and high connection concurrency.

code

+----------------------------------------------------------------------+
|                     Real-Time Messaging Architecture                 |
|                                                                      |
|  [ Client A ] === WebSocket ===> [ Gateway Cluster ]                 |
|                                         |                            |
|                                         v (Session Registry)         |
|  [ Client B ] <== WebSocket === [ Redis Session Broker ]             |
+----------------------------------------------------------------------+

2. Gateway Connection Management & Session Registry

Web servers cannot simply store open WebSocket sockets in memory across multiple load-balanced instances without a centralized session registry:

Connection Gateways: Lightweight server nodes holding open TCP/WebSocket connections.

Redis Session Registry: Maps userId -> { gatewayServerId, socketId }.

typescript

// Message Dispatch Flow:
async function sendMessage(fromUserId: string, toUserId: string, messageText: string) {
  // 1. Persist message with status: SENT
  const message = await db.message.create({
    data: { fromUserId, toUserId, text: messageText, status: 'SENT' }
  });

  // 2. Check if recipient is online in Redis
  const session = await redis.hget('active_sessions', toUserId);
  if (session) {
    const { serverId, socketId } = JSON.parse(session);
    // Publish to specific gateway server channel
    await redis.publish(`gateway:${serverId}`, JSON.stringify({ socketId, message }));
  } else {
    // 3. Recipient offline: Enqueue into Offline Message Queue
    await offlineQueue.push(toUserId, message.id);
  }

  return message;
}

1. Single Tick (Sent): Server acknowledges receipt and assigns message ID. 2. Double Tick (Delivered): Recipient device sends delivery ACK back to server. 3. Blue Ticks (Read): Recipient opens chat window and sends read ACK.

Designing a Scalable Real-Time Messaging Architecture Like WhatsApp

Recommended Posts

Docker & Kubernetes — From Containerization to Cluster Orchestration

CORS Deep Dive: Why the Browser Sends Preflight OPTIONS and How to Fix It

RESTful API vs GraphQL in Production: Trade-offs, N+1 Problem & Caching Reality

Related Projects

Related Certificates

Designing a Scalable Real-Time Messaging Architecture Like WhatsApp

1. The Real-Time Messaging Challenge

2. Gateway Connection Management & Session Registry

3. Message Delivery Status Lifecycle

4. Key Takeaways