DEV Community

Cover image for What Happens When You Visit a Website
Scofield Idehen
Scofield Idehen

Posted on

What Happens When You Visit a Website

Introduction
In today's digital age, we often take for granted the seamless experience of accessing websites with just a few clicks or taps. However, behind this seemingly simple action lies a complex series of processes and interactions between various web infrastructure components.

Have you ever wondered what happens when you type https://www.google.com into your browser's address bar and press Enter? In this article, we'll journey to demystify the intricate steps involved, shedding light on the magic behind the scenes.

The DNS Request

The journey begins with your browser reaching out to a Domain Name System (DNS) server to translate the human-readable domain name (www.google.com) into an IP address that machines can understand. This process is analogous to looking up a phone number in a directory before making a call.

Understanding DNS
The DNS is a hierarchical and decentralized system that acts as the internet's phone book, mapping domain names to their corresponding IP addresses. When you enter a domain name into your browser, it sends a request to a DNS server to obtain the IP address associated with that domain.

The DNS is organized into different levels, with the root servers at the top, followed by Top-Level Domain (TLD) servers, and then Authoritative Name Servers responsible for specific domains. This hierarchical structure allows for efficient distribution and caching of domain-to-IP mappings, ensuring fast resolution times.

The DNS Lookup Process

  1. Browser Cache: Before sending a request to a DNS server, your browser checks its local cache to see if it has a recently resolved IP address for the domain you entered. If found, the browser can skip the DNS lookup process and proceed directly to the next step.
  2. Operating System Cache: If the browser cache doesn't contain the required IP address, the browser checks the operating system's DNS cache, which stores recently resolved domain-to-IP mappings.
  3. Recursive DNS Resolver: If the IP address is not found in the local caches, the browser requests a recursive DNS resolver, typically provided by your Internet Service Provider (ISP) or configured on your network.
  4. Root and TLD Servers: The recursive resolver initiates the DNS resolution process by querying one of the root servers to obtain the IP address of the TLD server responsible for the domain (e.g., .com, .org, .net).
  5. Authoritative Name Servers: Once the TLD server provides the IP address of the Authoritative Name Server responsible for the domain, the recursive resolver contacts this server to obtain the final IP address associated with the domain you entered.
  6. Response Caching: The resolved IP address is cached by the recursive resolver, operating system, and browser for a specified time (Time-to-Live or TTL) to speed up future requests for the same domain.

With the IP address obtained, your browser can now initiate a connection with the server hosting the website.

TCP/IP and Network Communication

The Transmission Control Protocol/Internet Protocol (TCP/IP) suite governs how data is transmitted over the internet, ensuring reliable and ordered delivery of packets between your browser and the web server.

TCP's Three-Way Handshake
Before data can be exchanged, your browser and the web server establish a TCP connection through a process called the "three-way handshake":

  1. SYN: Your browser sends a synchronization (SYN) packet to the server, requesting to initiate a connection.
  2. SYN-ACK: The server acknowledges the request by sending a synchronization-acknowledgment (SYN-ACK) packet back to your browser.
  3. ACK: Your browser responds with an acknowledgment (ACK) packet, completing the three-way handshake and establishing a reliable TCP connection.

IP Routing and Packet Delivery
With the TCP connection established, data can be transmitted between your browser and the web server using the Internet Protocol (IP). IP addresses uniquely identify devices on the internet, allowing routers to forward data packets along the most efficient path to their destinations.
Routers examine the destination IP address in each packet and use routing tables to determine the next hop in the journey. This process continues until the packets reach the web server's network, where they are reassembled in the correct order based on the TCP sequence numbers.

Firewall Security Checks

Before the request reaches the web server, it must pass through a firewall – a security system that monitors incoming and outgoing network traffic. The firewall acts as a gatekeeper, inspecting each packet against a predefined set of rules to determine whether to allow or block it.

Firewall Rules and Policies
Firewall rules are based on factors such as the source and destination IP addresses, ports, protocols, and other criteria. These rules protect the server from potential threats, such as malicious attacks, unauthorized access attempts, and other malicious activities.

The incoming request can proceed to the web server if it adheres to the firewall's rules. However, if the request violates the rules, it is blocked, and an appropriate response (e.g., an error message) is sent back to the client.

HTTPS and SSL/TLS Encryption

Since you entered https://www.google.com, your browser establishes a secure connection using the Hypertext Transfer Protocol Secure (HTTPS) and Secure Sockets Layer/Transport Layer Security (SSL/TLS) protocol. This encryption ensures that the data exchanged between your browser and the server remains private and secure, protecting it from eavesdropping and tampering.

SSL/TLS Handshake
Before data can be transmitted securely, your browser and the web server perform an SSL/TLS handshake to establish an encrypted communication channel:

  1. Hello Messages: Your browser sends a "Client Hello" message to the server, indicating the SSL/TLS version and cipher suites (encryption algorithms) it supports.
  2. Server Response: The server responds with a "Server Hello" message, confirming the chosen SSL/TLS version and cipher suite, and sends its SSL certificate.
  3. Certificate Validation: Your browser validates the server's SSL certificate by checking its authenticity and expiration date and issuing authority (Certificate Authority or CA).
  4. Key Exchange: If the certificate is valid, your browser and the server exchange encryption keys using asymmetric cryptography (e.g., RSA) to establish a shared secret key for symmetric encryption.
  5. Encrypted Communication: With the shared secret key, all subsequent data exchanged between your browser and the server is encrypted using symmetric encryption algorithms, providing a secure communication channel.

HTTPS and SSL/TLS Benefits
HTTPS and SSL/TLS encryption provide several benefits, including:

  • Confidentiality: Data exchanged between your browser and the server is encrypted, preventing eavesdropping and protecting sensitive information like login credentials, credit card details, and personal data.
  • Integrity: SSL/TLS ensures that data cannot be modified in transit without detection, protecting against man-in-the-middle attacks and data tampering.
  • Authentication: The SSL certificate validation process helps verify the identity of the website you're connecting to, preventing impersonation and phishing attacks. ## Load Balancing and Scalability

Large websites like Google receive an immense amount of traffic from users around the globe. To handle this load efficiently and ensure high availability, they employ load balancers – systems that distribute incoming traffic across multiple web servers.

How Load Balancers Work
Load balancers are intermediaries between clients (your browser) and the web servers hosting the website. When a request arrives, the load balancer determines which web server should handle it based on various load-balancing algorithms and server health checks.
Common load-balancing algorithms include:

  • Round-Robin: Requests are distributed sequentially among the available servers.
  • Least Connections: The server with the fewest active connections receives the next request.
  • IP Hash: Requests from the same client IP address are always sent to the same server for session persistence.

Load balancers continuously monitor the health and availability of the web servers, automatically rerouting traffic away from failed or overloaded servers to maintain service availability and performance.

Benefits of Load Balancing
Load balancing provides several benefits, including:

  • Scalability: Additional web servers can be easily added or removed from the pool to handle fluctuating traffic levels.
  • High Availability: If one web server fails, the load balancer redirects traffic to the remaining healthy servers, ensuring service continuity.
  • Session Persistence: Algorithms like IP Hash ensure that subsequent requests from the same client are routed to the same server, maintaining the session state and improving user experience.
  • Security: Load balancers can act as a first line of defense against distributed denial-of-service (DDoS) attacks by filtering malicious traffic before it reaches the web servers. ## Web Server Processing

Once your request has navigated through the load balancer, it reaches one of the available web servers responsible for processing and serving the requested content. The web server acts as the backbone of the website, handling incoming requests and delivering the appropriate responses.

Web Server Software

Web servers are powered by software that handles HTTP/HTTPS requests and responses. Some popular web server software options include:

  • Apache HTTP Server: One of the most widely used open-source web servers, known for its stability, flexibility, and extensive module ecosystem.
  • Nginx: A high-performance, lightweight web server and reverse proxy server, often used for load balancing and serving static content.
  • Microsoft Internet Information Services (IIS): A web server software developed by Microsoft primarily used on Windows Server operating systems.

These web server software applications are responsible for interpreting incoming requests, processing them, and generating appropriate responses.

Static Content Delivery

If the requested resource is a static file (e.g., HTML, CSS, JavaScript, images), the web server can directly serve the file from its file system or cache. This process is straightforward: the web server reads the requested file and returns it to your browser.

Dynamic Content Generation
However, many websites nowadays rely on dynamic content generated on the fly based on user input, personalization, or data retrieval from databases. In these cases, the web server may delegate the request processing to an application server.

Application Server Interaction
Application servers execute server-side logic, process user input, and interact with databases or other data sources to generate dynamic content. Common application server technologies include:

  • Java Application Servers: Apache Tomcat, JBoss, WebLogic, WebSphere
  • .NET Application Servers: Internet Information Services (IIS), WebSphere Application Server
  • Node.js: A JavaScript runtime that can be used for server-side scripting
  • PHP Servers: Apache/Nginx with PHP module, Microsoft IIS with PHP support

When the web server receives a request for dynamic content, it forwards it to the appropriate application server for processing. The application server executes the necessary code (e.g., Java, .NET, Node.js, PHP) and retrieves the required data from databases or other sources.

For example, when you search on Google, the web server receives your request. It passes it to the application server, which interacts with Google's search index and algorithms to dynamically generate the relevant search results.

Database Interaction

Many websites rely on databases to store and retrieve data efficiently. In the case of dynamic content generation, the application server may need to interact with one or more databases to fetch or update data.

Common database management systems (DBMS) used in web applications include:

  • Relational Databases: MySQL, PostgreSQL, Oracle, Microsoft SQL Server
  • NoSQL Databases: MongoDB, Cassandra, Redis, Couchbase

The application server establishes a connection with the database, executes queries (e.g., SQL for relational databases, document-based queries for NoSQL databases), and retrieves or manipulates the necessary data.

For example, when you log into a website, the application server might query a user database to verify your credentials and fetch your user profile data.

Response Generation and Rendering

Once the application server has processed the request and gathered the necessary data, it generates the appropriate response (e.g., HTML, JSON, XML) and sends it back to the web server. The web server, in turn, forwards the response to your browser over the established HTTPS connection.

Your browser then receives the response, parses the HTML, CSS, and JavaScript, and renders the website content on your screen, providing the final result of your initial request.

Throughout this intricate process, various components work in harmony, ensuring that your request is securely handled, processed efficiently, and delivered to your browser in a timely and reliable manner.

Top comments (11)

Collapse
 
programcrafter profile image
ProgramCrafter

A fine description, although the article would be a bit better if IP came before TCP (and maybe before DNS as well)!

Collapse
 
gadrawingz profile image
Gad Iradufasha

Well-described, As a dev, you cannot hate this useful post!

Collapse
 
scofieldidehen profile image
Scofield Idehen

Thank you for your kind words.

Collapse
 
sterry profile image
Terry

fantastic

Collapse
 
scofieldidehen profile image
Scofield Idehen

Thanks.

Collapse
 
codewithcaen profile image
CodeWithCaen

Great work explaining the fundamentals and the technologies involved!

Collapse
 
scofieldidehen profile image
Scofield Idehen

Thanks.

Collapse
 
edoh98 profile image
APOLLINAIRE

Unbelievable
Never knew before
Many thanks!!!

Collapse
 
fast4word profile image
Luke Bailey

in a much simpler post, when you type a url, press ctrl+u. HTML.

Collapse
 
libmi profile image
Flicker

Useful Knowledge

Collapse
 
oleksandr_berdychevskyi_9 profile image
Oleksandr Berdychevskyi

It was an awesome article. Brings a lot of benefits for me as a self-educated dev. Thanks a lot!👍