Web Workers

I like the way you work it

@nolanlawson

@nolanlawson

photo of Nolan Lawson
squarespace pouchdb

The web has a problem :(

Every line of frontend JS you've ever written has (momentarily) stopped your page from working.

60 frames per second (FPS)

1000ms / 60 frames = 16.7ms

Factor in browser overhead...

Paul Lewis, 10ms

WEB WORKERS!

// index.js

var worker = new Worker('worker.js');
worker.postMessage('ping');
worker.onmessage = function (e) {
  console.log(e.data); // 'pong'
};
// worker.js

self.onmessage = function (e) {
  console.log(e.data); // 'ping'
  self.postMessage('pong');
};

UI thread (main thread)

Four cores

Web Workers can do...

  • Ajax
  • IndexedDB
  • Anything JS can do
  • ...but not DOM
  • Virtual DOM!
pokedex.org virtual dom architecture

Pokedex.org on a 2011 Galaxy Nexus

React with Web Workers

Thank you!

nolanlawson.github.io/brooklynjs-2016-02