Using THREE libs in odd places

I am having a helluva time getting three.js to run inside a Cloudflare Unbound Worker. I have already faked it out to run inside Web Workers and on a Node server. Whyyyy? Because I use the non-gl libraries to do all the “rendering” of geometries, then blast the resulting float32arrays to the browser client for rendering. This is way more responsive for the user than doing it in the browser client thread. However, three.js doesn’t really want to run like this. Now I’m trying to get it to run in another “node-like” environment. But three’s build has all sorts of wrappers for exports and modules, etc. Any advice? To run inside an unbound worker, I need to concatenate all my scripts together. So no loaders or other module systems allowed.

Are you aware that you can mitigate this exact issue by rendering in a separate worker on the client-side? There is an example that demonstrates this approach.

If you click on START JANK at the screen’s bottom, you will see that the offscreen canvas approach will stay smooth although the main thread is under heavy load.

The advantage of this approach is a simpler architecture (since you need no server-side code) and it works independently of the user’s internet connection.

1 Like

OffscreenCanvas isn’t supported in all browsers yet. But the explicit goal of this exercise was to do server-side rendering. I have managed to wrap THREE in such as way as to accomplish this now.