Every day we type URLs into our browser, without thinking much about what happens behind the scenes.
But a surprising amount of technology is involved between pressing Enter and seeing a webpage appear.
From DNS lookups to TCP connections and rendering HTML, several systems work together in milliseconds to deliver a webpage.
Let’s walk through the complete journey step-by-step.
1. URL Parsing
Suppose you type this into your browser: www.example.com
The browser first breaks the URL into components.
| Component | Meaning |
|---|---|
https |
Protocol |
example.com |
Domain name |
/ |
Resource path |
The browser now understands:
- Which protocol to use
- Which server to contact
- Which resource is requested
2. Checking the Browser Cache
Before making a network request, the browser checks whether it already has the requested resource stored in its cache.
Modern browsers like Google Chrome and Mozilla Firefox store previously loaded resources locally.
If the cached version is valid:
✅ The page loads instantly
❌ No network request is required
If not, the browser proceeds to the next step.
3. DNS Lookup (Finding the Server)
Humans remember domain names, but computers communicate using IP addresses.
The browser must convert: example.com → 93.184.216.34
This conversion happens through the Domain Name System (DNS).
DNS Lookup Flow
The lookup process usually follows this order:
- Browser DNS cache
- OS DNS cache
- Router DNS cache
- ISP DNS server
If still not found, DNS queries travel through the DNS hierarchy until the IP address is returned.
4. Establishing a Connection (TCP Handshake)
Once the IP address is known, the browser establishes a connection with the server using Transmission Control Protocol.
This involves the three-way handshake:
- Client → SYN
- Server → SYN-ACK
- Client → ACK
This ensures both client and server are ready to communicate.
5. TLS Handshake (If HTTPS)
If the site uses HTTPS, an additional TLS handshake occurs.
This step:
- verifies the server’s identity
- establishes encrypted communication
Encryption protocols like Transport Layer Security protect the data transferred between the browser and server.
This prevents attackers from intercepting sensitive data like passwords.
6. Sending the HTTP Request
After the connection is established, the browser sends an HTTP request.
Example request:
GET / HTTP/1.1
Host: example.com
User-Agent: Chrome
Accept: text/html
This request tells the server:
- which resource is requested
- which browser is making the request
- what data formats it supports
7. Server Processing
The request reaches a web server like:
- Nginx
- Apache HTTP Server
The server may:
- return a static file
- call backend code
- query a database
- generate dynamic content
Once processing is complete, the server sends an HTTP response.
8. Server Response
The server sends a response that includes:
HTTP/1.1 200 OK
Content-Type: text/html
Followed by the webpage content (HTML).
Possible response codes include:
| Code | Meaning |
|---|---|
| 200 | Success |
| 301 | Redirect |
| 404 | Page not found |
| 500 | Server error |
9. Browser Rendering
Now the browser begins rendering the page.
This process includes:
- Parsing HTML → building the DOM
- Parsing CSS → building the CSSOM
- Executing JavaScript
- Building the Render Tree
- Layout calculation
- Painting pixels on the screen
JavaScript engines such as V8 JavaScript engine handle script execution.
10. Additional Requests
Most pages require additional resources such as:
- CSS files
- JavaScript files
- Images
- Fonts
Each resource triggers additional HTTP requests until the page fully loads.
Entire Flow
User types URL
↓
Browser parses URL
↓
Cache check
↓
DNS lookup
↓
TCP handshake
↓
TLS handshake (HTTPS)
↓
HTTP request sent
↓
Server processes request
↓
HTTP response returned
↓
Browser renders page
All of this usually happens in less than a second.
Final Thoughts
Typing a URL may seem simple, but it triggers a complex chain of events across browsers, networks, servers, and rendering engines.
Understanding this process gives you a deeper appreciation of how the web works—and helps you build better applications.
Top comments (0)