Browser render

Hisinhan / Mar 15 2022

12 mins read • 8,000 views

Multiple doors made of paper with gradient colors.

1. browser asks OS for server's IP address
2. OS makes a DNS lookup and replies the IP address to the browser
3. browser opens a TCP connection to server (this step is much more complex with HTTPS)
4. browser sends the HTTP request through TCP connection
5. browser receives HTTP response and may close the TCP connection, or reuse it for another request
6. browser checks if the response is a redirect or a conditional response (3xx result status codes), authorization request (401), error (4xx and 5xx), etc.; these are handled differently from normal responses (2xx)
7. if cacheable, response is stored in cache
8. browser determines what to do with response (e.g. is it a HTML page, is it an image, is it a sound clip?)
9. browser renders response, or offers a download dialog for unrecognized types
10. HTML start parsing to DOM Tree, and CSS parsing to CSSOM Tree, then combine them to render tree
11. Run layout and paint to the screen