Nâng CaoSystem Design iconSystem Design

Thiết kế hệ thống chat real-time như thế nào?

Hệ thống chat real-time cần dùng WebSocket để giao tiếp hai chiều giữa client và server, thay vì HTTP polling vì WebSocket giữ kết nối mở liên tục và có độ trễ thấp hơn nhiều.

Phía frontend gồm các components chính: MessageList (dùng virtualized list để hiển thị hàng nghìn tin nhắn mượt mà), MessageInput, và ChatSidebar hiển thị danh sách rooms. State management nên dùng Zustand hoặc Redux để quản lý messages và online status, kết hợp Optimistic UI hiển thị tin nhắn ngay lập tức trước khi server confirm để UX mượt hơn.

Cần có chiến lược reconnection tự động khi mất kết nối, lazy load tin nhắn cũ khi scroll lên, và dùng IndexedDB để cache messages offline giúp app vẫn hoạt động khi không có mạng.

Xem toàn bộ System Design cùng filter theo level & chủ đề con.

Mở danh sách System Design