DEV Community

Gift Egbonyi
Gift Egbonyi

Posted on

What happens when you type a URL into your browser?

Hey friends! 👋

Let’s talk about something we all do every day:

Typing a URL into your browser

In case you don’t know what a URL is: URL stands for Uniform Resource Locator. It’s basically the address of a webpage, just like your home address tells people where you live, a URL tells the internet where a page is located.

We type URLs so casually:

https://google.com
Enter fullscreen mode Exit fullscreen mode

…but a lot happens behind the scenes before that page appears on your screen.


1️⃣ The browser checks the URL

Your browser first checks:

  • is this a valid URL?
  • is it HTTP or HTTPS?
  • which domain are we visiting?

Nothing is loaded yet, it's just making sure the link is valid.


2️⃣ It looks in the cache

Your browser asks itself:

“Have I seen this page before?”

It checks cached files like:

  • HTML
  • CSS
  • images
  • JavaScript

If it finds something fresh enough, it may skip some steps and load faster.
If not, it moves on.


3️⃣ DNS: Finding the website’s address

Computers don’t understand names like google.com.
They use IP addresses like:

142.250.187.14
Enter fullscreen mode Exit fullscreen mode

So the browser asks a DNS server:

“What is the IP address for this domain?”

If the server knows, it replies with the correct address.
Now your browser knows where on the internet to go.


4️⃣ Your browser says hello to the server

Once the IP address is known, the browser reaches out to the server hosting the site using HTTP or HTTPS.

This is basically a digital handshake:

“Hi, can you send me the page for google.com?”

With HTTPS, this handshake is encrypted to keep your data safe.


5️⃣ The server sends the HTML back

If everything is fine, the server responds with:

  • HTML (the main file)
  • links to CSS, images, scripts, fonts, etc.

The browser now starts building the webpage.


6️⃣ The browser builds the page step by step

This part is called rendering, and it happens in three simple steps:

✔️ Builds the DOM

Turns HTML into a tree of elements.

✔️ Builds the CSSOM

Applies your CSS rules.

✔️ Renders everything visually

Combines both trees to draw the page.

This is how:

  • layouts
  • colours
  • buttons
  • text

all appear where they should.


7️⃣ JavaScript runs

After rendering starts, JavaScript files load.
These files:

  • fetch data
  • handle clicks
  • update the UI
  • power animations
  • run app logic

This is when the page becomes “interactive”.


8️⃣ The page finally appears

Once everything above is done, you see the final webpage — and the browser keeps running scripts or fetching data as needed.

All of this happens in a twinkle of an eye.


🙋🏾‍♀️ Wrap-Up

So the next time you type:

https://gift-egbonyi.onrender.com
Enter fullscreen mode Exit fullscreen mode

Remember this little journey:

URL → Cache → DNS → Server → HTML → DOM → CSS → Render → JavaScript → Page.

It’s a lot of steps, but browsers make it feel instant.

That’s it for today!
What should we talk about next Wednesday? Drop it below 👇

Connect with me on GitHub

Was this tutorial helpful? Got questions? Drop them in the 💬, I love feedback.


I’m keeping these light, fun, and useful, one small project at a time.
If you enjoyed this, leave a 💬 or 🧡 to let me know.

Follow me for more short, beginner-friendly JavaScript lessons every week.

I'm still hunting for full stack roles,
contract or full-time.
Please check out my [Portfolio](https://gift-egbonyi.onrender.com)
Enter fullscreen mode Exit fullscreen mode

Portfolio

Web trails:
LinkedIn | X (Twitter)

See you next Wednesday 🚀, hopefully, on time like today!

Till then, write clean code and stay curious. 🦋

Top comments (0)