Browser URL Example
What happens when you start typing google in your browser's search bar?
https://github.com/alex/what-happens-when
Simplified
Keyboard Actions
Key Pressed: "g" key pressed; browser processes it and suggests URLs based on history.
Enter Key: Physical keypress leads to electrical signals transmitted to the computer.
USB keyboard: Current flows to logic circuitry, keycode is generated and sent.
Virtual keyboard: Capacitive touch registers keypress, sends a software interrupt.
OS-Level Events
Interrupts:
OS detects the keypress and triggers an interrupt request.
Windows: Sends a
WM_KEYDOWNmessage.macOS: Sends an
NSEvent.Linux: Xorg server listens for keycodes.
URL Parsing
URL or Search Term: Determines if the input is a URL or search term.
Non-ASCII Characters: Converts characters using Punycode if needed.
Network Communication
DNS Lookup:
If the browser doesn't find the domain in its local cache, it sends a request to the DNS server (usually provided by the ISP or a local router).
If the DNS server doesn't have the answer, it will act as a recursive resolver, querying other DNS servers higher up in the hierarchy on behalf of the client.
ARP Process: Determines the MAC address for the DNS server or default gateway.
Socket Opening: Establishes a connection to the server using TCP.
TLS Handshake: Encrypts communication using SSL/TLS for HTTPS.
HTTP Protocol
Request: Sends an HTTP request to the server (e.g., GET request).
Response: Server returns HTML, possibly with a status code (e.g.,
200 OK).Resources: Browser fetches additional resources (images, CSS) as needed.
Browser Rendering
HTML Parsing: Parses the HTML document into a DOM tree.
CSS Parsing: Interprets CSS to apply styles.
Rendering: Constructs a render tree, lays out elements, and paints them on the screen.
GPU Rendering: Uses GPU for faster rendering in modern browsers.
Post-Rendering
JavaScript Execution: Runs any JavaScript on the page.
User Interaction: Scripts and network requests can be triggered by user input.
Last updated
