What Happens When You Type "google.com" into Your Browser's Address Bar and Press Enter?
1. Auto-Completion and URL Parsing
Auto-Completion
As soon as you press the letter “g,” your browser may kick off its auto-completion feature, provided it’s enabled. This handy feature draws from your search history, bookmarks, and cookies to suggest possible completions for your query.
Search History: If you’ve visited
google.com
before, the browser remembers this and suggests it.Bookmarks: Bookmarked sites containing “g” or “google.com” are also suggested.
Cookies: Data stored in cookies can further refine these suggestions.
URL Parsing
Once you press Enter after typing google.com
, the browser has to determine if what you typed is a URL or just a search term. Here’s how it does that:
URL Recognition: The browser checks if
google.com
is a valid URL. It looks for a protocol (e.g.,http://
,https://
) and a domain (e.g.,.com
,.net
).Search Engine Use: If the input doesn't conform to URL patterns, the browser treats it as a search term and forwards it to the default search engine for results.
2. HSTS Check
Before making any network connections, the browser checks if google.com
is on the HTTP Strict Transport Security (HSTS) list. This list comprises websites that have declared they should only be accessed using HTTPS.
HSTS Mechanism: Browsers maintain a list of HSTS-enabled sites. If
google.com
is on this list, the browser forces the connection to be HTTPS, ensuring a secure communication channel.
3. DNS Lookup
The next step is to resolve google.com
into an IP address. This involves a DNS lookup, which translates human-readable domain names into machine-understandable IP addresses.
DNS Lookup Steps
Browser Cache: The browser first checks its own cache for an existing IP address for
google.com
.OS Host File: If not found in the cache, it checks the OS host file using
gethostbyname()
.DNS Server Request: If the IP address is still not found, the browser sends a request to the DNS server specified in your network settings (often your router).
UDP/TCP Connection: The DNS request is sent using UDP on port 53. If the response is too large for UDP, the request is upgraded to use TCP.
Recursive Query: If the local DNS server doesn’t have the information, it performs a recursive query, going up the hierarchy of DNS servers until it finds the authoritative server for
google.com
.
4. Establishing a TCP Connection
Once the browser has the IP address for google.com
, it establishes a TCP connection to the server at that address.
TCP Connection Steps
Three-Way Handshake:
SYN Packet: The browser sends a SYN packet to the server to initiate a connection.
SYN-ACK Packet: The server responds with a SYN-ACK packet, acknowledging the connection request.
ACK Packet: The browser sends an ACK packet, confirming the connection.
Packet Creation:
Segment: A TCP segment is created with source and destination ports.
Packet: An IP header is added, forming a packet with the server's IP address.
Frame: A frame header is added, including MAC addresses, readying the packet for network transmission.
Data Transmission:
Router Hops: The packet is forwarded through various routers. Each hop decreases the packet's Time-To-Live (TTL) value.
TTL Expiry: If TTL reaches zero, the packet is dropped. This mechanism prevents infinite loops in the network.
5. Performing a TLS Handshake
To ensure secure communication, a Transport Layer Security (TLS) handshake is performed between the browser and the server.
TLS Handshake Steps
ClientHello: The browser sends a
ClientHello
message, including its TLS version, supported cipher suites, and algorithms.ServerHello: The server replies with a
ServerHello
message, selecting the TLS version and cipher suite, and sends its digital certificate containing the public key.Certificate Verification: The browser checks the server's certificate against its list of trusted Certificate Authorities (CAs). If trusted, it proceeds.
Key Exchange: The browser generates a random key, encrypts it with the server's public key, and sends it to the server.
Symmetric Key Generation: Both the browser and server use this key to independently generate a shared symmetric key.
Finished Messages: The browser sends a
Finished
message encrypted with the symmetric key. The server decrypts it, verifies it, and sends its ownFinished
message back.
6. Making an HTTP Request
With a secure connection established, the browser sends an HTTP request to the server.
HTTP Request Steps
Sending the Request: The browser typically sends a GET request to fetch the web page. This request includes headers with information like browser type, acceptable content types, and cookies.
Receiving the Response: The server processes the request and sends back an HTTP response containing the HTML content and various headers.
7. Rendering the Web Page
Finally, the browser begins the process of rendering the received HTML content into a visible web page.
Rendering Steps
HTML Parsing: The browser parses the HTML content and constructs a Document Object Model (DOM) tree, representing the page structure.
Page Layout: The browser calculates the layout of the page, determining the size and position of each element.
Rendering: The browser paints the page on the screen, applying styles and rendering images, videos, and other resources.
Repaint/Reflow: As dynamic content loads or user interactions occur, the browser continuously updates and re-renders parts of the page.
References
https://github.com/alex/what-happens-when
https://blog.ehoneahobed.com/what-happens-when-you-type-wwwgooglecom-in-your-browser-and-press-enter
https://forum.freecodecamp.org/t/what-happens-when-you-type-https-www-google-com-in-your-browser-and-press-enter/561581
https://www.linkedin.com/pulse/what-happens-when-you-type-googlecom-your-browser-press-sule-bala/
https://dev.to/antonfrattaroli/what-happens-when-you-type-googlecom-into-a-browser-and-press-enter-39g8
https://kevinkiruri.medium.com/what-happens-when-you-type-google-com-in-your-browser-and-press-enter-979955e31baf
https://dev.to/judevector/what-happens-when-you-type-googlecom-in-your-browser-and-press-enter-4a2n