0%

Webworker in TensorFlowjs

Note

This article is originally written at Medium.
https://medium.com/@wl1508/webworker-in-tensorflowjs-49a306ed60aa

Tl:dr

TensorFlow.js just got native support for web workers! With web workers, long-running computation will not block the UI. In addition to the browser, you can use web workers in Node (v10.5+) via worker_threads.

But wait, what is Web Worker?

A modern browser runs a single thread for User Interface (UI) rendering and Javascript execution. If we run many large-scale computations simultaneously, they will block the UI rendering process since they are sharing the same thread. To solve this problem, modern browsers have introduced the concept of a “Web Worker”, which allows you to create an additional thread to dedicate to things other than UI rendering, such as long-running computation.
By using TensorFlow.js in a web worker, we can put all the computation-demanding operations into a different thread. In this way, our computation does not interfere with UI rendering and users’ interactions with the web.

So, how to use Web Workers?

First of all, we need to write a worker script that writes all the computation logic inside. Below is a quick snippet of our worker.js file:

So, it seems a lot of things are happening here. First, the importScripts is to import the tfjs into the worker environment. Then, we make two tensors and add them up to simulate a massive computation. Then, we post the message back to our main/UI thread by postMessage. Note that, due to the mechanism of Javascript, you can not post back a non-original Object (in this case is the tf.Tensor).
Then, in the main thread we create a new worker and listen to the worker’s messages:

So this chunk of code is quite like we listen to a dom object and waiting for a trigger with event data.
How much will the worker improve the experience of using tfjs? Below are two demos, with and without a web worker, demonstrating the usability benefits:

See the Pen tfjs in ui thread by wl1508 (@bakabaka) on CodePen.

See the Pen tfjs in worker by wl1508 (@bakabaka) on CodePen.

Yes! That is fantastic. Can I use it anywhere?

The first thing we need to notice is that our browser should have the support for web workers. From the canIuse website, you can check out if your target browsers support this exciting feature.
As of today, among the major browsers, Chrome(69 or later version) and Firefox (49 or later with flag to enable) support OffscreenCanvas, which allows TensorFlow.js to use WebGL acceleration in a web worker. For browsers that do not support OffscreenCanvas, you can still benefit from the non-blocking computation since TensorFlow.js falls back to CPU mode automatically though it is much slower.
Moreover, you can also use the web workers in nodejs by using the worker_threads module. If you have the node version which is v10.5 or later, you can use the flag ( — experimental-worker) to enable the worker.