DEV Community

Cover image for What Happens When You Type a URL in Your Browser? 🌐
Abdul Basit Muhyideen
Abdul Basit Muhyideen

Posted on

What Happens When You Type a URL in Your Browser? 🌐

What Happens When You Type a URL in Your Browser? 🌐

The unseen journey of your request — explained for developers.

You open your browser, type www.google.com, and boom — Google appears in seconds.

But what really happens in that tiny moment between hitting “Enter” and seeing the page load?

Behind the scenes, dozens of technologies and protocols spring into action. It’s like a relay race between your browser, DNS servers, routers, and Google’s data centers — all in milliseconds.

Let’s break it down step by step 👇


1. You Type the URL (and the Browser Gets to Work) 💻

When you type https://www.google.com and press Enter, your browser first breaks down that URL into pieces:

  • Protocolhttps:// (how to communicate)
  • Domain namewww.google.com (where to go)
  • Path/search (what resource to fetch, if any)

If it’s your first visit, the browser doesn’t know where www.google.com lives — so it has to find the IP address. That’s where DNS comes in.


2. DNS Lookup: Finding the Address 🗺️

The Domain Name System (DNS) works like the Internet’s phonebook.

When your browser asks, “Where is google.com?” it goes through these steps:

  1. Browser Cache – Has it been visited recently? If yes, it already knows the IP.
  2. OS Cache – If not, your computer’s operating system checks next.
  3. Router Cache – Still not found? The router checks its local DNS cache.
  4. ISP DNS Server – Finally, your Internet provider queries a global DNS system to find the IP (like 142.250.190.4).

Once found, the result is cached for faster access next time.


3. The Browser Opens a TCP Connection 🔗

Now that your browser knows Google’s IP address, it can connect.

It starts by creating a TCP connection — the reliable communication link of the Internet.
This is called the TCP handshake, and it happens in 3 steps:

  1. SYN → Browser says, “Hey server, are you there?”
  2. SYN-ACK → Server replies, “Yes, I am. Ready?”
  3. ACK → Browser confirms, “Let’s talk!”

This ensures both sides are ready to exchange data safely.


4. HTTPS & TLS Handshake: Secure the Channel 🔒

Because the URL uses HTTPS, the connection must be secure.

So, after the TCP handshake, the browser and server perform a TLS handshake (Transport Layer Security):

  • The server sends its SSL certificate to prove its identity.
  • The browser verifies the certificate (checking if it’s valid, trusted, and matches the domain).
  • Both agree on encryption keys to secure the session.

Once this is done, all data sent between your browser and the server is encrypted.


5. Sending the HTTP Request 📩

Finally, your browser sends an HTTP request to the server.

Example:

GET / HTTP/1.1
Host: www.google.com
User-Agent: Chrome/120.0
Accept: text/html
Enter fullscreen mode Exit fullscreen mode

This tells the server:

  • The method (GET) — “I want to read something.”
  • The resource (/) — the homepage.
  • Browser details and supported content types.

6. The Server Processes the Request ⚙️

On Google’s end, powerful web servers receive your request.

Here’s what happens there:

  1. The server routes your request to the correct backend service (for example, Google Search).
  2. Backend logic runs — retrieving data, rendering pages, calling APIs.
  3. The server generates a response, typically in HTML (or JSON for APIs).

Example response:

HTTP/1.1 200 OK
Content-Type: text/html
Content-Length: 3050
Enter fullscreen mode Exit fullscreen mode

And then comes the HTML document — the skeleton of the web page.


7. Browser Renders the Page 🧠

Once your browser receives the response, it gets busy again:

  1. HTML Parsing – Reads the HTML and builds the DOM (Document Object Model).
  2. CSS Parsing – Loads styles and builds the CSSOM.
  3. JavaScript Execution – Runs scripts that may modify the DOM or fetch more data.
  4. Layout & Painting – Figures out where everything goes and paints pixels to your screen.

This is when you see the website appear — text, images, buttons, all beautifully arranged.


8. More Requests Behind the Scenes 🔁

Even after the main HTML loads, the browser continues fetching:

  • Images (.jpg, .png)
  • CSS stylesheets
  • JavaScript files
  • Fonts
  • APIs for dynamic data

Each of these makes its own HTTP request to the server (or CDNs). That’s why browsers load resources in parallel for speed.


9. Caching, Cookies, and Performance 🍪

Before finishing, the browser checks caching rules:

  • Cache-Control headers decide if the resource can be reused.
  • Cookies might be stored or sent back for authentication or personalization.
  • Compression (like GZIP or Brotli) helps reduce file sizes for faster loading.

All these optimizations ensure that the next visit feels instant.


10. You See the Page ✨

And there you have it — a full journey completed in under a second!

From typing a URL to seeing a page, here’s what just happened:

  1. You entered a URL
  2. DNS resolved the domain
  3. TCP & TLS handshakes secured the channel
  4. HTTP request sent
  5. Server processed and responded
  6. Browser rendered and displayed the content

All these layers work together — perfectly synchronized — to give you the illusion of instant access.


Wrapping Up 🎯

Every time you type a URL, you trigger an orchestra of systems, protocols, and servers that collaborate to deliver what you see.

For backend engineers, understanding this flow is gold:

  • You’ll know where latency creeps in.
  • You’ll grasp how APIs communicate.
  • You’ll understand why DNS, SSL, and caching matter so much.

Next up in the series: “Understanding HTTP and HTTPS — The Internet’s Communication Language.” 🚀

Top comments (0)