Intro to browser internals

Browsers are a complicated piece of software composed of many different modules which work together to provide a unified interface to the world of the Internet. People usually underestimate how much work browsers do behind the scene, after all, there is way more to the magic than sending and receiving HTTP requests and responses.

Most notably a browser consists of the following parts:

  1. Networking stack — usually provided by the Operating System
  2. Widget Library — For displaying controls, menu bars, the User Interface of the browser
  3. Rendering engine — For parsing HTML and CSS
  4. JavaScript Interpreter — As the name suggests

Although there are numerous rending engines and JS Interpreters in the wild, I’ll focus on the ones found in major browsers, specifically the following -

Safari

Safari used the WebKit rendering engine developed by Apple which in itself is forked from KHTML and KJS (KDE HTML and JavaScript engines). Webkit itself consists of two parts — WebCore which is responsible for rendering layouts (HTML and CSS) and a JavaScript Core for parsing and interpreting JavaScript. The JavaScript Core was later rewritten and today is replace by an LLVM based just in time compiler called FTL, which stands for “Fourth-Tier-LLVM.”

Chrome

Chrome initially used the WebCore part of WebKit rendering engine, but for its JavaScript needs it relied on the V8 JavaScript engine (Also used by the Node.js project). In 2013, Chrome forked the WebKit engine and create its own rendering engine called Blink which is now used by default in Chrome as well as Opera browser.

Firefox

Firefox uses the SpiderMonkey JavaScript engine which is credited as the first JavaScript engine, created by Brenden Eich, the creator of JavaScript programming language. For rendering, it uses the Gecko web browser engine

Internet Explorer/Edge

A browser plagued with issues w.r.t. to HTML and CSS standards, they did have a mighty name for their layout engine — Trident. This was later forked by the Edge team and rename to EdgeHTML. Internet Explorer uses the Chakra engine for executing JScript (Yes intentionally called such to avoid trademark issues with Sun). Later on, the Edge team forked it to create their own “JavaScript” engine, also called Chakra.