What happens when you type google.com in your browser and press Enter

INTRODUCTION

Ever wondered what happens behind the scenes when you enter a web address like "https://www.google.com" into your browser and hit Enter? Join us as we delve into the journey of a web request, from the initial DNS lookup to the final webpage rendering.

HOW THE WEB WORKS

The internet is a network of interconnected computers categorized as clients and servers. Clients are typical user devices such as computers or phones connected to the internet, running web browsers like Firefox or Chrome. Servers, on the other hand, store web content like webpages and applications.

In addition to clients and servers, there's the internet connection itself, enabling data transmission.

The Browser

A browser, also known as a web browser or Internet browser, is software that allows users to access and explore content on the World Wide Web.

DNS (Domain Name System)

DNS is a system that uses specialized servers to match web addresses (e.g., www.google.com) to the real IP addresses of websites. An IP address is a unique numerical identifier for web locations.

IP Address

Real web addresses are represented by IP addresses (e.g., 192.0.2.172). The Domain Name System (DNS) was introduced to simplify remembering these numerical addresses.

TCP/IP (Transmission Control Protocol / Internet Protocol)

TCP/IP are communication protocols defining how data should travel across the internet. TCP ensures reliable data transmission by breaking data into packets and managing their delivery.

Firewall

Firewalls are network security measures that filter incoming and outgoing traffic based on predefined security rules, acting as a barrier between the local network and the outside world.

HTTPS/SSL (HTTP Secure / Secure Sockets Layer)

HTTPS encrypts data transmitted between the browser and the server, providing confidentiality and integrity. SSL (Secure Sockets Layer) or its successor, TLS (Transport Layer Security), are cryptographic protocols securing this communication.

Load Balancer

Load balancers distribute workload across multiple servers, enhancing reliability, efficiency, and availability of websites, especially under heavy traffic.

Web Server

Web servers store web server software and a website's component files, serving requests and generating webpages dynamically.

Application Server

Application servers sit between database servers and web servers, executing application code, handling business logic, interacting with databases, and generating dynamic content.

Database

Databases process requests for data retrieval or storage, connecting to the application server and returning information.

UNDERSTANDING THE ANATOMY OF A WEB REQUEST

When you type google.com into your browser and press enter, the browser sends a request to the DNS server to find the real address of the server that the website lives on, this is called an IP address, and it represents a unique location on the web.

The browser sends an HTTP (Hypertext Transfer Protocol) request to the server asking it to send a copy of the website to the client. This message and all other data sent between the client and the server is sent across your internet connection using TCP/IP

After establishing a TCP/IP connection, the request passes through any firewalls that may be in place. For secure communication, HTTPS (Hypertext Transfer Protocol Secure) is used and in many cases, especially for popular websites like Google, a load balancer comes into play. When you have an enterprise application or website that gets lots of hits, your server might be under heavy load. In that case you may want to consider distributing the load across multiple servers, as a result google has many IP addresses which translates to different servers.

If the server approves the clients request, the server sends the client a “200 OK” message which means “Of course you can look at the website! Here it is” and then starts sending the websites files to the browser as a series of small chunks called data packets. There are multiple reasons why data is sent in small packets. They are sometimes dropped or corrupted and it’s easier to replace small chunks when this happens. Additionally, the packets can be routed along different paths making exchange faster and allowing many different users to download the same website at the same time.

The browser assembles the small chunks into a complete web page and displays it to you.

ORDER OF COMPONENT FILE PARSING

When a browser requests HTML files from servers, the HTML often contains <link> elements referencing external CSS stylesheets and <script> elements referencing external JavaScript scripts.

The browser first parses the HTML file and identifies <link> and <script> element references.

As the browser parses the HTML, it sends requests for any CSS and JavaScript files.

The browser then generates an in-memory DOM (Document Object Model) tree from the parsed HTML, and an in-memory CSSOM (CSS Object Model) structure from the parsed CSS.

While building the DOM tree and applying styles from the CSSOM, the browser compiles and executes the parsed JavaScript.

As a result, a visual representation of the page is painted on the screen, allowing user interaction.