Real-time features in HLD - Architecture Diagram

System Overview - Real-time features

This system enables real-time communication and updates between users and services. It supports instant message delivery, live notifications, and quick data synchronization with minimal delay.

Architecture Diagram

User
  |
  v
Load Balancer
  |
  v
API Gateway
  |
  v
WebSocket Service <--> Message Broker <--> Notification Service
  |                      |
  v                      v
Database <-------------- Cache

Components

User

client

Initiates real-time requests and receives live updates

Load Balancer

load_balancer

Distributes incoming user connections evenly to backend services

API Gateway

api_gateway

Routes requests to appropriate services and handles authentication

WebSocket Service

service

Maintains persistent connections for real-time data exchange

Message Broker

message_queue

Manages asynchronous message delivery between services

Notification Service

service

Processes and sends real-time notifications to users

Database

database

Stores persistent user data and message history

Cache

cache

Stores frequently accessed data to reduce latency

Request Flow - 10 Hops

User → Load Balancer

Load Balancer → API Gateway

API Gateway → WebSocket Service

WebSocket Service → Cache

Cache → WebSocket Service

WebSocket Service → Message Broker

Message Broker → Notification Service

Notification Service → Database

Notification Service → WebSocket Service

WebSocket Service → User

Failure Scenario

Component Fails:Message Broker

Impact:Real-time message delivery is delayed or lost, notifications do not reach users promptly

Mitigation:Use message broker replication and persistent queues to prevent message loss and enable failover

Architecture Quiz - 3 Questions

Which component handles persistent connections for real-time data exchange?

A API Gateway

B Load Balancer

C WebSocket Service

D Message Broker

Design Principle

This architecture uses a combination of persistent WebSocket connections and asynchronous message queues to enable scalable, low-latency real-time features. Caching reduces database load and speeds up data retrieval, while message brokers decouple services for reliability and scalability.

Practice

1. Which protocol is commonly used to enable real-time communication in web applications?

easy

A. SMTP

B. HTTP/1.1

C. WebSocket

D. FTP

Solution

1. Step 1: Understand real-time communication needs

   Real-time apps require a protocol that supports two-way, instant data exchange.

2. Step 2: Identify protocol features

   WebSocket allows full-duplex communication over a single connection, unlike HTTP/1.1 which is request-response only.

3. Final Answer:

   WebSocket -> Option C

4. Quick Check:

   Real-time = WebSocket [OK]

Hint: Real-time needs two-way instant data flow: WebSocket fits best [OK]

Common Mistakes:

• Confusing HTTP with WebSocket for real-time
• Choosing FTP or SMTP which are not real-time protocols
• Thinking HTTP/2 is the same as WebSocket

2. Which component in a real-time system is responsible for distributing messages from producers to consumers?

easy

A. Broker

B. Producer

C. Consumer

D. Database

Solution

1. Step 1: Define roles in real-time messaging

   Producers send data, consumers receive data, and brokers route messages between them.

2. Step 2: Identify the distributor

   The broker acts as the middleman ensuring messages reach the right consumers.

3. Final Answer:

   Broker -> Option A

4. Quick Check:

   Message routing = Broker [OK]

Hint: Broker connects producers and consumers by routing messages [OK]

Common Mistakes:

• Confusing producer as distributor
• Thinking consumer sends messages
• Assuming database handles message routing

3. Consider a chat app using WebSocket. If the server receives a message from User A and broadcasts it to 100 connected users, what is the main bottleneck to scale this real-time feature?

medium

A. User A's device speed

B. Client browser rendering speed

C. Database read latency

D. Server CPU and network bandwidth

Solution

1. Step 1: Analyze message flow in real-time chat

   The server receives and then sends the message to all connected users, requiring CPU and network resources.

2. Step 2: Identify bottleneck

   Server CPU handles message processing; network bandwidth handles sending to many users simultaneously.

3. Final Answer:

   Server CPU and network bandwidth -> Option D

4. Quick Check:

   Scaling real-time = Server resources [OK]

Hint: Server resources limit broadcast scale, not client or DB speed [OK]

Common Mistakes:

• Blaming client device speed for server load
• Focusing on database latency which is less critical here
• Ignoring network bandwidth limits

4. A real-time notification system uses MQTT but users report delayed messages. Which is the most likely cause?

medium

A. Clients are using WebSocket instead of MQTT

B. Broker is overloaded and dropping messages

C. Messages are too small to send quickly

D. Users have disabled notifications on their devices

Solution

1. Step 1: Understand MQTT broker role

   The broker routes messages; if overloaded, it queues or drops messages causing delays.

2. Step 2: Evaluate other options

   Clients using WebSocket instead of MQTT would cause connection issues, not delays; small messages send faster; disabled notifications affect display, not delivery.

3. Final Answer:

   Broker is overloaded and dropping messages -> Option B

4. Quick Check:

   Delays usually mean broker overload [OK]

Hint: Delays often mean broker overload, not client protocol mismatch [OK]

Common Mistakes:

• Blaming client protocol mismatch for delays
• Assuming small messages cause delays
• Ignoring broker capacity limits

5. You are designing a real-time stock price update system for millions of users. Which approach best ensures scalability and low latency?

hard

A. Use a distributed message broker cluster with topic partitions and WebSocket connections

B. Store all prices in a single database and poll clients every second

C. Send updates via email to all users when prices change

D. Use HTTP long polling from clients to server for updates

Solution

1. Step 1: Understand scalability needs

   Millions of users require distributed systems to handle load and maintain low latency.

2. Step 2: Evaluate options

   Distributed brokers with topic partitions allow parallel processing; WebSocket supports instant push updates. Polling and email cause delays and high load.

3. Final Answer:

   Use a distributed message broker cluster with topic partitions and WebSocket connections -> Option A

4. Quick Check:

   Scalable real-time = Distributed broker + WebSocket [OK]

Hint: Distributed brokers + WebSocket scale best for millions [OK]

Common Mistakes:

• Choosing polling which wastes resources and adds latency
• Using email which is not real-time
• Relying on a single database causing bottlenecks