Perform texture computation on web worker #107
Conversation
| await proxy.computeTextureData( | ||
| values, | ||
| customDomain || dataDomain, | ||
| hasLogScale, | ||
| colorMap | ||
| ) |
There was a problem hiding this comment.
Thanks to comlink, it's just like calling an async method!
| const scale = (isLog ? scaleSymlog : scaleLinear)(); | ||
| scale.domain(domain); | ||
| return scale; | ||
| } |
There was a problem hiding this comment.
If I understand well, you had to make useDataScale a regular function rather than a hook to be able to call it from the worker that is not a hook ?
There was a problem hiding this comment.
I would have liked to pass the scale returned by useDataScale to the web worker, but as I mentioned, you can't pass functions to a web worker. https://github.com/GoogleChromeLabs/comlink/blob/master/structured-clone-table.md
| // eslint-disable-next-line | ||
| // @ts-ignore | ||
| import Worker from 'worker-loader!./worker'; // eslint-disable-line |
There was a problem hiding this comment.
🙄 and create-react-app, which doesn't include worker-loader...
There was a problem hiding this comment.
... ad Jest, which doesn't really like webpack's inline loader syntax...
I used
comlink, which simplifies writing and communicating with web workers, along withreact-use-comlink.I had to replace
useDataScalewith a utility function so I could recreate the data scale on the web worker (functions can't be sent to web workers).The result is that the UI remains fluid while the texture is being recomputed.
Next, I'll investigate whether there's a better way to send the values to the web worker. At the moment, the JS array is copied. I hear it's better to transfer a
Uint8Arrayby reference... I don't think I'll bother with moving finding the domain to a web worker, as it seems to be pretty fast at the moment, and it only occurs once when selecting a dataset (contrary to the texture, which is recomputed when the config changes).