Links
- browser-perf - a tool to automate calculating performance metrics like frame rates for a website
- web-perf.github.io/react-perf - Tracing ReactJS performance across versions of the library
- React-worker-dom - Implementation of ReactJS in a web worker. Alternate implemenetation using jsdom like proxy.
Slides
Abstract
Modern web applications are awesome. And complicated. The Javascript
libraries that power them today do a lot of work to abstract out the
hard parts. Whether using constructs like Virtual DOM, or fancy change
detection algorithms, the amount of work that the Javascript library
does is only increasing.
Unfortunately, all this work now competes for the same resources that
the browser needs, to do things like render a page, or apply styles. In
many cases, this makes the browser slow, preventing the web application
from attaining its full, smooth experience.
Web workers have been in the browser for a while, but they have mostly
been used for engaging demos like adding mustaches in a cat video :)
In this talk, we will explore how mainstream Javascript libraries like
React or Angular use Web Workers to get great performance. We will look
at quantitative numbers from hundreds of test runs that conclusively
show how Web Workers can make apps faster. Finally, we will also look at
practical examples to convert existing examples, and the potential
limitations of this approach.