What Happens When You Type Google.com in Your Browser?

A classic system design and computer science interview question. Based on the ByteByteGo architecture infographic, here is a step-by-step breakdown of the complex processes that happen behind the scenes in milliseconds.

1. Domain Object Resolution (DNS & Caching)

When you type www.google.com, your computer cannot communicate via text names. It needs to find the exact numerical IP address of the server hosting the website. It proceeds systematically through various caches:

• Browser Cache: Has your browser visited this site recently and cached the IP?
• Operating System Cache: If not in the browser, does the OS have the IP cached in its lookup table?
• Router Cache: Does your local home/office router know the IP?
• ISP Cache: Does your Internet Service Provider's DNS server have it cached?

The DNS Query (If Cache Fails)

If the IP isn't found in any of those rapid caches (a cache miss), a formal Domain Name System (DNS) lookup begins across the internet network:

1. Root Name Server: The ISP's DNS resolver queries the global root server layer.
2. TLD Nameserver: The query is systematically directed downward to the Top-Level Domain (TLD) server (in this case, for .com domains).
3. Authoritative Nameserver: Finally, it queries the specific authoritative nameserver for google.com, which returns the exact, correct IP address back to your browser.

2. Initiating the TCP Connection

With the destination IP address successfully identified, the browser initiates a Transmission Control Protocol (TCP) connection with the remote Google web server to reliably and securely transfer data. This standard initialization is done via a TCP 3-Way Handshake:

1. SYN: The client browser sends a synchronize (SYN) packet to the server to initiate connection.
2. SYN-ACK: The server responds with a synchronize-acknowledge (SYN-ACK) packet, indicating readiness.
3. ACK: The client browser responds with an acknowledge (ACK) packet.

Handshake Success! The reliable connection is now officially established and ready for data.

3. The HTTP Request & Server Response

Now that an open and secure pipeline exists:

• The HTTP Request: The networking layer of the browser sends an HTTP GET request to the web server asking for the root resource (GET www.google.com).
• The Server Response: The web server architecture processes this request and sends back a structured response to the client. This response primarily contains the raw HTML document file, accompanied by HTTP status codes and headers.

4. The Critical Rendering Path

Once the browser receives the raw files from the server, the critical rendering path begins. Several internal browser components (Browser Engine, Rendering Engine, Networking, and JS Engine) work together asynchronously:

1. Parse HTML Document: The browser Engine reads the raw bytes, passes it through a Tokenizer, and constructs the DOM Tree (Document Object Model) node by node.
2. Parse CSS Stylesheet: Simultaneously, the browser parses the requested CSS stylesheets, tokenizes them, and builds the CSSOM Tree (CSS Object Model).
3. Load JavaScript: The Javascript engine downloads, parses, and executes structural JavaScript files independently.
4. Construct Render Tree: The browser elegantly combines the DOM Tree and CSSOM Tree to create a unified Render Tree, which filters and calculates only the elements that will actually be visible on the page.
5. Layout & Painting:
   • Layout: The rendering engine calculates the exact mathematical geometry and position of each element on the screen.
   • Painting: Finally, it paints the individual pixels directly onto the monitor.

The Google homepage is now visibly rendered on your screen in a fraction of a second!