What happens when you enter a URL into your browser?

Every day, we access websites to search for information. Have you ever wondered what actually happens when we enter a URL into the browser's search bar? In today's article, let's discuss that together.

Basically, the entire process consists of the following steps:

1. DNS Lookup

Based on your URL, the browser will perform a DNS (Domain Name System) lookup to resolve the domain into the public IP address where the actual servers are running (e.g. example.com -> IP 72.10.2.3). This is similar to asking for directions to someone's house, but to actually get there, you need to know the exact house number.

The DNS lookup process is relatively complex. DNS records can be cached in various places, such as within the browser’s cache or across the internet.

First, the browser checks its cache, then the operating system's cache (you can see it in files like /etc/hosts), the cache of the local router in the network, or even the DNS server cache of the ISPs (Internet Service Providers) until it finds the DNS record associated with the domain in the URL.

2. Establishing a Connection

After finding the server's IP address, the browser will establish a TCP (Transmission Control Protocol) connection to begin communication and data transfer.

Depending on the protocol used in the URL, if HTTPS is being used, an SSL/TLS handshake takes place, where the server and client agree on encryption methods to secure the communication.

3. Browser Sends HTTP Request to the Server

Once the connection is established, the browser sends an HTTP/HTTPS request to the server to request access to the webpage resource.

The request includes a request method (e.g., GET for a webpage), along with headers that provide additional information like the browser type, cookies, and cache.

4. Server Response

The server takes the request and, based on the information in the request line, headers, and body, decides how to process the request. For the request GET /posts/sport HTTP/1.1, the server retrieves the content at this path, constructs the response, and sends it back to the client. The response contains the following:

• A status line, telling the client the status of the request.
• Response headers, informing the browser how to handle the response.
• The requested resource at that path, which could be content like HTML, CSS, JavaScript, image files, or data.

5. Rendering the Page

Once the browser receives the response from the server, it inspects the response headers for information on how to render the resource. The Content-Type header, for example, tells the browser it received an HTML resource in the response body.

The browser then starts rendering the page:

Parsing HTML: The browser constructs the Document Object Model (DOM), a hierarchical tree structure representing the page's elements.

Fetching CSS and JavaScript: If the HTML references CSS or JavaScript, the browser fetches these files. CSS rules are applied to style the page, and JavaScript is executed to add functional. The browser may fetch images, videos, fonts, etc.

That is the entire process from the moment you enter a URL into the browser until the browser displays the webpage you are looking for.

I hope you will find something insightful.

Again, I’m Phan, a curious and dedicated developer.

See you in the next posts.