What Happens When You Type a URL into the Browser

System Design

Learn System Design

Introduction to System Design

How to Learn System Design?

Key Characteristics of Distributed Systems

Scalability

Availability

Latency and Performance

Concurrency and Coordination

Monitoring and Observability

Resilience and Error Handling

Fault Tolerance vs. High Availability

Flashcards Review

Chapter Assessment

Network Essentials

HTTP vs. HTTPS

TCP vs. UDP

HTTP: 1.0 vs. 1.1 vs 2.0 vs. 3.0

URL vs. URI vs. URN

What Happens When You Type a URL into the Browser

Flashcards Review

Chapter Assessment

Long-Polling vs. WebSockets vs. Server-Sent Events

Introduction to Real-Time Communication

What is Long-Polling?

What is WebSocket?

What are Server-Sent Events?

Difference Between Long-Polling, WebSockets, and Server-Sent Events

Flashcards Review

Chapter Assessment

Domain Name System (DNS)

Introduction to DNS

DNS Resolution Process

DNS Load Balancing and High Availability

Flashcards Review

Chapter Assessment

Proxies

What is a Proxy Server?

Uses of Proxies

VPN vs. Proxy Server

Flashcards Review

Chapter Assessment

Load Balancing

Introduction to Load Balancing

Load Balancing Algorithms

Uses of Load Balancing

Load Balancer Types

Stateless vs. Stateful Load Balancing

High Availability and Fault Tolerance

Scalability and Performance

Challenges of Load Balancers

Flashcards Review

Chapter Assessment

API Gateway

Introduction to API Gateway

Usage of API gateway

Advantages and disadvantages of using API gateway

Flashcards Review

Chapter Assessment

API Design

What Is an API?

What Are REST APIs?

Resources, Not Actions

HTTP Methods and Their Semantics

URL Design

Request and Response Shapes

Status Codes and Error Design

Pagination from the Consumer's View

Idempotency Keys

Versioning and Backward Compatibility

Concurrency and Conditional Requests

REST vs gRPC vs GraphQL

Flashcards Review

Chapter Assessment

Rate Limiting and Throttling

What Is Rate Limiting

Rate Limiting Algorithms

Distributed Rate Limiting

Rate Limiting in Practice

Flashcards Review

Chapter Assessment

Caching

Introduction to Caching

Why is Caching Important?

Types of Caching

Cache Replacement Policies

Cache Invalidation

Cache Read Strategies

Cache Coherence and Consistency Models

Caching Challenges

Cache Performance Metrics

Flashcards Review

Chapter Assessment

CDN

What is CDN?

Origin Server vs. Edge Server

CDN Architecture

Push CDN vs. Pull CDN

Flashcards Review

Chapter Assessment

Data Partitioning

Introduction to Data Partitioning

Partitioning Methods

Data Sharding Techniques

Benefits of Data Partitioning

Common Problems Associated with Data Partitioning

Flashcards Review

Chapter Assessment

Redundancy and Replication

What is Redundancy?

What is Replication?

Replication Methods

Data Backup vs. Disaster Recovery

Flashcards Review

Chapter Assessment

CAP & PACELC Theorems

Introduction to CAP Theorem

Components of CAP Theorem

Trade-offs in CAP Theorem

Examples of CAP Theorem in Practice

Beyond CAP Theorem

System Design Trade-offs in Interviews

Flashcards Review

Chapter Assessment

Databases (SQL vs. NoSQL)

Introduction to Databases

SQL Databases

NoSQL Databases

SQL vs. NoSQL

ACID vs BASE Properties

Real-World Examples and Case Studies

SQL Normalization and Denormalization

In-Memory Database vs. On-Disk Database

Data Replication vs. Data Mirroring

Database Federation

Flashcards Review

Chapter Assessment

Indexes

What are Indexes?

How a B-Tree Index Works

Types of Indexes

B-Tree vs. LSM Tree

Indexes in Distributed Systems

Flashcards Review

Chapter Assessment

Bloom Filters

Introduction to Bloom Filters

Benefits & Limitations of Bloom Filters

Variants and Extensions of Bloom Filters

Applications of Bloom Filters

Flashcards Review

Chapter Assessment

Quorum

Why Quorum?

What is Quorum?

Flashcards Review

Chapter Assessment

Leader and Follower

What is Leader and Follower Pattern?

Flashcards Review

Chapter Assessment

Heartbeat

What is Heartbeat?

Flashcards Review

Chapter Assessment

Checksum

What is Checksum?

Uses of Checksum

Flashcards Review

Chapter Assessment

Distributed Messaging System

Introduction to Messaging System

Introduction to Kafka

Messaging patterns

Popular Messaging Queue Systems

RabbitMQ vs. Kafka vs. ActiveMQ

Scalability and Performance

Flashcards Review

Chapter Assessment

Distributed File Systems

What is a Distributed File System?

Architecture of a Distributed File System

Key Components of a DFS

Flashcards Review

Chapter Assessment

Security

What is Security and Privacy?

What is Authentication?

What is Authorization?

Authentication vs. Authorization

OAuth vs. JWT for Authentication

What is Encryption?

What are DDoS Attacks?

Flashcards Review

Chapter Assessment

Misc Concepts

Batch Processing vs. Stream Processing

XML vs. JSON

Synchronous vs. Asynchronous Communication

Push vs. Pull Notification Systems

Microservices vs. Serverless Architecture

Message Queues vs. Service Bus

Stateful vs. Stateless Architecture

Event-Driven vs. Polling Architecture

Flashcards Review

Chapter Assessment

Quiz - System Design Fundamentals

Quiz

System Design Trade-offs

Importance of Discussing Trade-offs

Strong vs Eventual Consistency

Latency vs Throughput

ACID vs BASE Properties in Databases

Read-Through vs Write-Through Cache

Batch Processing vs Stream Processing

Load Balancer vs. API Gateway

API Gateway vs Direct Service Exposure

Proxy vs. Reverse Proxy

API Gateway vs. Reverse Proxy

SQL vs. NoSQL

Primary-Replica vs Peer-to-Peer Replication

Data Compression vs Data Deduplication

Server-Side Caching vs Client-Side Caching

REST vs RPC

Polling vs. Long-Polling vs. WebSockets vs. Webhooks

CDN Usage vs Direct Server Serving

Serverless Architecture vs Traditional Server-based

Stateful vs Stateless Architecture

Hybrid Cloud Storage vs All-Cloud Storage

Token Bucket vs Leaky Bucket

Read Heavy vs Write Heavy System

Quiz

How to Approach a System Design Interview

System Design Interviews - A step by step guide

Functional vs. Non-functional Requirements

What are Back-of-the-Envelope Estimations?

Things to Avoid During System Design Interview

System Design Master Template

Quiz

Designing a URL Shortening Service like TinyURL

Quiz - Designing URL Shortner

Designing Pastebin

Quiz - Designing Pastebin

Designing Instagram

Quiz - Designing Instagram

Designing Dropbox

Quiz - Designing Dropbox

Designing Facebook Messenger

Quiz - Designing Facebook Messenger

Designing Twitter

Quiz - Designing Twitter

Designing Youtube or Netflix

Quiz - Designing Youtube

Designing Typeahead Suggestion

Quiz - Designing Typeahead Suggestion

Designing an API Rate Limiter

Quiz - Designing an API Rate Limiter

Designing Twitter Search

Quiz - Designing Twitter Search

Designing a Web Crawler

Quiz - Designing a Web Crawler

Designing Facebook’s Newsfeed

Quiz - Designing Facebook’s Newsfeed

Designing Yelp or Nearby Friends

Quiz - Designing Yelp or Nearby Friends

Designing Uber backend

Quiz - Designing Uber backend

Designing Ticketmaster

Quiz - Designing Ticketmaster

Dynamo: How to design a key value store?

Dynamo: Introduction

High-Level Architecture

Data Partitioning

Replication

Vector Clocks and Conflicting Data

The Life of Dynamo’s put() & get() Operations

Anti-entropy Through Merkle Trees

Gossip Protocol

Dynamo Characteristics and Criticism

Summary: Dynamo

Quiz: Dynamo

Mock Interview: Dynamo

Designing YouTube Likes Counter (medium)

YouTube Likes Counter

Quiz

Cassandra: How to Design a Wide-column NoSQL Database?

Cassandra: Introduction

High-level Architecture

Replication

Cassandra Consistency Levels

Gossiper

Anatomy of Cassandra's Write Operation

Anatomy of Cassandra's Read Operation

Compaction

Tombstones

Summary: Cassandra

Quiz: Cassandra

Mock Interview: Cassandra

Kafka: How to Design a Distributed Messaging System?

Messaging Systems: Introduction

Kafka: Introduction

High-level Architecture

Kafka: Deep Dive

Consumer Groups

Kafka Workflow

Role of ZooKeeper

Controller Broker

Kafka Delivery Semantics

Kafka Characteristics

Summary: Kafka

Quiz: Kafka

Mock Interview: Kafka

Chubby: How to Design a Distributed Locking Service?

Chubby: Introduction

High-level Architecture

Design Rationale

How Chubby Works

File, Directories, and Handles

Locks, Sequencers, and Lock-delays

Sessions and Events

Master Election and Chubby Events

Caching

Database

Scaling Chubby

Summary: Chubby

Quiz: Chubby

Mock Interview: Chubby

HDFS: How to Design File Storage System?

Hadoop Distributed File System: Introduction

High-level Architecture

Deep Dive

Anatomy of a Read Operation

Anatomy of a Write Operation

Data Integrity & Caching

Fault Tolerance

HDFS High Availability (HA)

HDFS Characteristics

Summary: HDFS

Quiz: HDFS

Mock Interview: HDFS

GFS: How to Design a Distributed File System Storage?

Google File System: Introduction

High-level Architecture

Single Master and Large Chunk Size

Metadata

Master Operations

Anatomy of a Read Operation

Anatomy of a Write Operation

Anatomy of an Append Operation

GFS Consistency Model and Snapshotting

Fault Tolerance, High Availability, and Data Integrity

Garbage Collection

Criticism on GFS

Summary: GFS

Quiz: GFS

Mock Interview: GFS

BigTable: How to Design a Wide Column Storage System?

BigTable: Introduction

BigTable Data Model

System APIs

Partitioning and High-level Architecture

SSTable

GFS and Chubby

Bigtable Components

Working with Tablets

The Life of BigTable's Read & Write Operations

Fault Tolerance and Compaction

BigTable Refinements

BigTable Characteristics

Summary: BigTable

Quiz: BigTable

Mock Interview: BigTable

Designing Reddit (medium)

Design Reddit

Quiz

Designing Notification Service (medium)

Designing a Notification System

Quiz

Design Google Calendar (medium)

Design Google calendar (Medium)

Quiz

Design a Recommendation System (medium)

Design a Recommendation System for Netflix

Quiz

Designing Gmail (medium)

Design Gmail

Quiz

Designing Google News (medium)

Design Google News, a Global News Aggregator System (Medium)

Quiz

Designing Unique ID Generator (medium)

Design Unique ID Generator (Easy)

Quiz

Designing Code Judging System (medium)

Design Code Judging System like LeetCode (Medium)

Quiz

Designing Payment System (hard)

Design Payment System

Quiz

Designing Flash Sale System (hard)

Design a Flash Sale for an E-commerce Site (Hard)

Quiz

Designing Reminder Alert System (hard)

Design a Reminder Alert System

Quiz

System Design Patterns

Introduction: System Design Patterns

1. Bloom Filters

2. Consistent Hashing

3. Quorum

4. Leader and Follower

5. Write-ahead Log

6. Segmented Log

7. High-Water Mark

8. Lease

9. Heartbeat

10. Gossip Protocol

11. Phi Accrual Failure Detection

12. Split Brain

13. Fencing

14. Checksum

15. Vector Clocks

16. CAP Theorem

17. PACELC Theorem

18. Hinted Handoff

19. Read Repair

20. Merkle Trees

Quiz

What Happens When You Type a URL into the Browser

dns

http

caching

cdn

hard

7 min

·Updated Sep 2026·Credit: System Design Fundamentals

You type shop.example.com/products/42 into the browser and press Enter. Less than a second later, the product page appears.

In that second, the request passes through many separate systems: name servers, networks, a content delivery network, load balancers, app servers, caches, and databases. Then the browser turns the response into a page and asks for more files.

This lesson follows that path once, step by step, in the order it really happens. It connects the ideas from this chapter, and it shows where the time goes.

The Whole Path

Here are the main steps. The sections below explain each one.

The browser reads the URL.
DNS turns the host name into an IP address.
The browser opens a TCP connection.
For HTTPS, a TLS handshake secures the connection.
The browser sends the HTTP request.
A CDN edge server answers, or passes the request to the origin.
The origin servers build the response.
The browser renders the page and requests the files it needs.

The eight steps from typing a URL to a rendered page: parse, DNS, TCP, TLS, request, CDN edge, origin servers, and rendering

Step 1: The Browser Reads the URL

First, the browser decides whether you typed an address or a search. shop.example.com/products/42 looks like an address. best running shoes looks like a search, so the browser sends it to a search engine instead.

For an address, the browser splits the URL into its parts. The scheme says which protocol to use. You did not type one, so the browser uses HTTPS. The host is shop.example.com, and the path is /products/42. The URL vs. URI vs. URN lesson explains these parts.

The browser also checks whether it has a fresh copy of this page in its own cache. If it does, it can show the page without using the network at all.

Step 2: DNS Turns the Name into an IP Address

Networks move data between IP addresses, not names. So the browser must find the IP address for shop.example.com. The system that does this is DNS (Domain Name System), which stores the IP addresses for domain names.

The browser looks for the answer in several places, from the nearest to the farthest.

The browser's own cache. It may have looked up this name recently.
The operating system's cache.
A DNS resolver. This is a server, usually run by your internet provider or a public service. If the resolver does not know the answer, it asks other DNS servers in order. First it asks the root servers, then the servers for .com, and then the servers for example.com.

Each answer comes with a TTL (time to live), which says how many seconds the answer may be cached. So most lookups end in a cache and take almost no time. A full lookup through the resolver can take tens to hundreds of milliseconds. The DNS resolution process lesson covers this in detail.

Step 3: The Browser Opens a TCP Connection

The browser now knows the IP address. Next it opens a TCP connection to port 443, the default port for HTTPS.

TCP starts with a three-way handshake. The client sends SYN, the server replies with SYN-ACK, and the client sends ACK. This costs one round trip, which is the time for a message to reach the server and come back. No request data moves until the handshake finishes.

Step 4: TLS Secures the Connection

Because the scheme is HTTPS, the browser and server now run a TLS handshake.

The server sends its certificate, which proves it owns shop.example.com.
The browser checks that a trusted certificate authority signed the certificate, and that it has not expired.
Both sides create the same secret key, which encrypts everything from now on.

With TLS 1.3, this takes one more round trip. With the older TLS 1.2, it takes two. The HTTP vs. HTTPS lesson explains the handshake.

Step 5: The Browser Sends the HTTP Request

Now the browser sends the request. In the text form of HTTP/1.1, it looks like this.

GET /products/42 HTTP/1.1
Host: shop.example.com
Accept: text/html
Cookie: session=abc123

The request names a method (GET) and a path. Its headers include the host and any cookies the browser stored for this site. HTTP itself is stateless, so the cookie tells the server who you are.

With HTTP/2 or HTTP/3, the same information travels in a binary format, but the meaning is the same. The HTTP versions lesson compares them.

Step 6: A CDN Edge Server Often Answers First

For a popular website, the IP address from step 2 usually belongs to a CDN (content delivery network), not to the company's own servers. A CDN is a group of servers in many cities. The request reaches an edge server near the user.

Cache hit. If the edge server has a fresh copy of the response, it answers immediately. The request never reaches the company's servers.
Cache miss. If it does not have a copy, it passes the request on to the origin, which is the company's own servers.

Static files, like images and scripts, are often cache hits. Personal pages, like your shopping cart, are usually passed to the origin. The What is CDN? lesson explains more.

Step 7: The Origin Builds the Response

On a cache miss, the request reaches the origin, where several parts work in order.

Load balancer. It picks one healthy app server from a group of identical servers.
API gateway. In many systems, the request passes through a gateway that checks authentication and rate limits, and routes it to the right service.
App server. The application code runs and builds the response.
Cache. The app first checks a fast cache, like Redis, for the product data.
Database. The app reads the database only if the cache does not have the data. It then saves a copy in the cache for the next request.

On a CDN cache miss, the request passes the load balancer and API gateway to an app server, which checks the cache before the database

The response goes back along the same path. It carries a status code, like 200 OK, and headers, like Cache-Control, which says how long the response may be cached. Text responses are usually compressed, which makes them several times smaller for the trip back. If the response may be cached, the CDN keeps a copy on the way, so the next nearby user gets a cache hit.

Step 8: The Browser Renders the Page

The first response is only the HTML document. The browser now turns it into a page.

It reads the HTML and builds the page structure, called the DOM (Document Object Model).
It finds references to other files: stylesheets, scripts, fonts, and images.
It requests those files, often many at the same time.
It applies the styles, runs the scripts, calculates where everything goes on the screen, and draws the page.

The HTML arrives first, and reading it reveals stylesheets, scripts, images, and fonts, which the browser requests over the connection that is already open

A page often needs 50 to 100 files, so this second pass is usually larger than the first. Three ideas from this chapter keep it fast.

Connection reuse. The browser keeps the connection open, so steps 3 and 4 do not repeat for each file on the same host.
Multiplexing. HTTP/2 and HTTP/3 send many requests over one connection at the same time.
Caching. The CDN serves most files from the edge. The browser also stores files, so a repeat visit may not download them again.

Files from other hosts, like a separate image domain, need their own DNS lookup and connection.

Where the Time Goes

Count the round trips before the first byte of the page arrives, on a new HTTPS connection with a cached DNS answer.

Step	Round trips
DNS lookup	0 if cached, 1 or more if not
TCP handshake	1
TLS handshake	1 with TLS 1.3, 2 with TLS 1.2
Request and first byte of the response	1

That is three or four round trips before the first byte arrives, not counting the server's own work.

Now compare two distances. Suppose the server is on another continent, and a round trip takes 150 ms. Three round trips add 450 ms. Now suppose a CDN edge server is in the same city, and a round trip takes 20 ms. The same three round trips add only 60 ms.

Three round trips take about 450 ms to a server far away, but only about 60 ms to a nearby CDN edge server

This comparison explains many network design choices.

DNS answers are cached, so step 2 usually costs nothing.
Connections are reused, so steps 3 and 4 do not repeat.
Content is served from nearby edge servers, so every remaining round trip is short.
Newer protocols cut round trips. HTTP/3 replaces the TCP and TLS handshakes with one QUIC handshake, and returning visitors can often skip the handshake wait.

Every one of these either removes a round trip or makes one shorter.

Key Takeaways

The browser reads the URL, and DNS turns the host name into an IP address, usually from a cache.
The browser opens a TCP connection with a three-way handshake, then secures it with a TLS handshake for HTTPS.
The request often reaches a CDN edge server first. Only on a cache miss does it go to the origin.
At the origin, a load balancer picks a server, and the app checks a cache before the database.
The HTML response leads to many more requests for stylesheets, scripts, fonts, and images, over connections that stay open.
A new HTTPS connection spends three or four round trips before the first byte. Caching, connection reuse, and nearby edge servers exist to remove or shorten those round trips.

This one request uses every idea in this chapter: URLs, TCP, TLS, HTTP, and the round trips between them. That completes the chapter. Next is a Flashcards Review of the key terms, followed by the Chapter Assessment.

Practice Questions

Try each question first, then open the answer.

1. Put these steps in the order they happen: TLS handshake, render the HTML, DNS lookup, send the HTTP request, TCP handshake.