Code Cartoons Articles
-
Making WebAssembly even faster: Firefox’s new streaming and tiering compiler
People call WebAssembly a game changer because it makes it possible to run code on the web faster. Some speedups are already present, and some are yet to come. With streaming compilation, the browser compiles the code while the code is still being downloaded. Up until now, this was just a potential future speedup. But with the release of Firefox 58 next week, it becomes a reality. Firefox 58 also includes a new 2-tiered compiler. The new baseline compiler compiles code 10–15 times faster than the optimizing compiler. Combined, these two changes mean we compile code faster than it comes in from the network.
-
Entering the Quantum Era—How Firefox got fast again and where it’s going to get faster
Over the past seven months, we’ve been rapidly replacing major parts of the engine, introducing Rust and parts of Servo to Firefox. Plus, we’ve had a browser performance strike force scouring the codebase for performance issues, both obvious and non-obvious. We call this Project Quantum, and the first general release of the reborn Firefox Quantum comes out tomorrow.
-
The whole web at maximum FPS: How WebRender gets rid of jank
The Firefox Quantum release is getting close. It brings many performance improvements, including the super fast CSS engine that we brought over from Servo. But there’s another big piece of Servo technology that’s not in Firefox Quantum quite yet, though it’s coming soon. That’s WebRender, which is being added to Firefox as part of the […]
-
Inside a super fast CSS engine: Quantum CSS (aka Stylo)
Project Quantum is a major rewrite of Firefox’s internals to make Firefox fast. We’re swapping in parts from our experimental browser, Servo, and making massive improvements to other parts of the engine. The first major component from Servo—a new CSS engine called Quantum CSS (previously known as Stylo)—is now available for testing in our Nightly version. It brings together state-of-the-art innovations from four different browsers to create a new super CSS engine.
-
Creating a WebAssembly module instance with JavaScript
This is the 1st article in a 3-part series of articles with code cartoons that illustrate how to get started running WebAssembly modules in the browser today, how to work with memory in WebAssembly, and how to use table imports.
-
Memory in WebAssembly (and why it’s safer than you think)
This is the 2nd article in a 3-part series of articles with code cartoons about running WebAssembly modules and memory safety.
-
WebAssembly table imports… what are they?
This is the 3rd article in a 3-part series of articles with code cartoons that illustrate how to get started running WebAssembly modules and how to use table imports.
-
A crash course in memory management
This is the first article in a 3-part series of code cartoons that explore SharedArrayBuffers in JavaScript and how they are used. To understand why ArrayBuffer and SharedArrayBuffer were added to JavaScript, you need to understand a bit about memory management.
-
A cartoon intro to ArrayBuffers and SharedArrayBuffers
This is the second article in a 3-part series of code cartoons that explore SharedArrayBuffers in JavaScript and how they are used.
-
Avoiding race conditions in SharedArrayBuffers with Atomics
This is the third article in a 3-part series of code cartoons that explore SharedArrayBuffers in JavaScript and how they are used.