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
…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
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
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)
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)