Under the Hood
Ever wondered why I start all the stories from under the hood?

Well, under the hood meaning what’s the intention, what was the thought process to write this story?

Where I get the motivation to write the story is covered in the under-the-hood section. My last story got a lot of opinions and love.

why our websites are slow- Importance of bundle size

I have covered a story on why websites are slow, discussing the importance of bundle size. I’ve put some point or say new approach to address the website performance or optimisation issues.

This story is the reading inspirations about bundles and how websites load s, and how browsers parse and compile them and what not else.

Bundles are the key
The more I read the more dots are connected. When Sundar Pichai was developing a browser in google even the founders weren’t agree with him then he can did something like this magically.

It seems difficult unless it’s done.

I use to the thought that serving websites from servers to browsers is not too important as we often have to deal only with writing code.

But the more software development journey I am pursuing the more dots are appearing in focus. Now the time has come to connect the dots and understand things a bit better from the basics.

Bundles are how the websites are served over the internet through the cables you have installed in your homes for internet connectivity.

Strange, bundles, seriously?

Yes, bundles are the collection of HTML, CSS and Javascript files that are served on the internet. These bundles carry the web pages of your website.

If you have about, home and profile page including CSS and images and HTML files then these are bundled, minified or let’s assume gipped into small chunks and shipped over the wires to your browser.

Blazingly fast
Imagine how fast these things work under the hood because it took less than 3/4 seconds to load the entire medium.com website or most of the website.

I mean even after that 3/4 seconds we humans are fighting for the website optimisation and performance issues, strange.

People can’t even wait for 4 seconds to load the website, I can’t even think what was the response of the first website user 🥸.

Internet and how it works
Firstly, the internet is not a browser. If you think the same, then let me rectify the mistake. Email, TCP, and browser are the services or so-called subsets of the internet.

Internet means connecting 2 computers together or having a conversation between 2 computers.

So if a server is located in the pacific Ocean and you are browsing in Canada, those servers and your computer are talking to each other to give you the result.

In this case, the result is the HTML files or webpages that contain your website.

Google Chrome makes an entry
And that’s where google chrome or browser comes into the game.

Once your computer gets the webpages from the servers still your computer needs software or tool to open, load or parse or compile the webpages.

Chrome does that for us without even taking any more from us, such a good job.

Chrome and its internal party
Now chrome receives the webpages and gets ready to organise the party for us. Chrome basically parses and compiles the web pages and loads the website.

Not only this chrome -

• Render the HTML file
• Execute the Javascript file
• Paint the website using CSS I can’t even imagine but I wish I could have developed such kind of software in my lifetime.

What happens when I google the domain name?
If search www.medium.com then the medium domain name will give my browser the IP address where the medium servers are located. From the medium servers, my browser will fetch the medium website or chunks of web pages called bundles.

These bundles are then parsed, compiled and execute on the browser to load the website.

The domain name only gives the IP address. Earlier we use to have only the IP address but it’s difficult to remember to the domain name comes after that.

This is how technology evolves over time, amazing.

Now we have a domain name that gives the server's IP address. From the IP address, we get the server location or latitude and longitude and through the cables, we talk to the server and ask for the website associated with the domain name.

Servers then return the website in whatever fashion it is, earlier it used to be HTML files now it’s more often in the form of bundles.

Lastly, once the files are received the browser does its work under the hood without complaints.

This is the basics, done and dusted.
Future evolution
This process will mostly remain the same. In order to make things fast, better servers are located nearby and more servers are installed to serve the website fast.

Otherwise, it would take more time for me to ask for the web pages from the server located in the Pacific Ocean than in the Indian ocean because I am located in India, so less distance has to be travelled and more fast things can happen.

Not even more servers, in future, we will have a decentralised system, where each computer will talk to each other and help serve each other.

If I have already searched the medium.com website and any new person near my computer or in the vicinity tries to google medium.com my computer will server the website to his.

Read about IPFS technology in blockchain and the web3 world.

We don’t have to rely on single centralised servers to serve our website. We can simply push it to the chain and all the computers in the world will act as servers and consumers themselves.

Pretty strange but quite powerful concept.

Conclusion
Still, a lot to understand since we only have chrome to parse the websites it’s not open-source so we can’t optimise or change the under-the-hood logic.

We can so far take care of bundles, a lot bit of servers and code optimization and good practise but i the future we might have good control the how the website is served.

Until next time, have a good day.
Keep developing
Shrey