What Is High-Level Design (HLD)? With Example

What Is High-Level Design (HLD)? With Example

High-Level Design (HLD) is the big-picture view of a system. It shows the major components and how they talk to each other. Anyone should be able to understand it in 30 seconds.

What HLD Contains

• The major components (auth, user, feed, chat services).
• How they talk to each other (REST, events, gRPC).
• External systems (database, cache, email provider, queue).
• The tech stack (Node.js, Express, MongoDB, Redis).
• Data flow: from input to output, what happens.

What HLD Does Not Contain

• Field-level schema details (that is LLD).
• Exact API endpoints and request shapes (that is LLD).
• Internal algorithms and logic (that is LLD).
• Edge cases and error responses (that is LLD).

Example: DevTinder HLD

Components:

• Express API server (monolith).
• MongoDB (user, connection, message, payment data).
• Redis (rate limiting, session cache, feed cache).
• Razorpay (payment gateway).
• Amazon SES (emails).
• Socket.IO server (chat).

Data Flow for Signup:

1. Client sends POST /signup to Express.
2. Express validates input.
3. Express hashes the password with bcrypt.
4. Express stores the user in MongoDB.
5. Express sends a welcome email via SES (async).
6. Express returns 201 to the client.

Auth: JWT in httpOnly cookie, verified by an auth middleware.

Why HLD Matters

HLD settles the architecture before LLD digs into detail. It surfaces missing pieces ("where do we send emails from?") and helps you estimate work. Skipping HLD means discovering those gaps during LLD or worse, during coding.

How Long Should HLD Take

For small projects, a few hours. For bigger ones, a few days. The work is thinking and sketching, not writing long documents.

The Takeaway

HLD shows the major components, how they talk, external systems, the tech stack, and data flow. It is the big picture. Write it before LLD. For small projects it can fit on one page.