Web Browsers are arguably the most important part of the internet today.
Browsers primarily fetch content and display it to the user. Browsers today are surprisingly powerful, they can run surprisingly complex design tools like Penpot to 3D games like Diablo.
There are multiple sophisticated components involved between the user interacting with the browser and parts like rendering, JavaScript execution, and networking.
The talk is aimed at giving a bird's eye view of how the different components in a Web Browser come together to create the interface through which the world gets to use the internet.
The main components of a browser are -
1) The User Interface
Tabs, Address Bar, Bookmarks, Downloads Button. Everything except the Window which renders the website.
2) The Browser Engine
The layer orchestrating the UI from the rendering engine.
3) The Rendering Engine
Displays requested content. It can render HTML, CSS, or even PDFs and images.
4) Networking
Handles HTTP Requests.
5) UI Backend
Draws the likes of buttons and inputs. Everything HTML styled with CSS.
6) JavaScript Interpreter
Parses (surprisingly also compiles) and executes JavaScript code
7) Data Storage
Ever accepted cookies that track you across websites? Data Storage includes parts like localStorage, IndexedDB, WebSQL, and the File System.
The talk also aims to show how some of these components may differ across major Web Browser implementations, and yet how browsers make websites look identical.