I’m having a strange issue with a fairly complex scene. I’ve spent a few days moving the entire 3D scene to an
offscreencanvas and I’ve moved the loading of my GLB files and texture maps to a web worker. This all works and I’m able to render the scene and it all looks the same as it did before, when I had a traditional canvas element.
However, I have a loading spinner on my page and after all the assets have loaded and I render the scene, the spinner starts janking. I’ve tried adopting a method where all my 3D objects are invisible and I reveal them one at a time, on each iteration of the render loop until they are all visible, and I can clearly see my spinner is becoming janky when the scene renders some glass objects with reflections on. I saw this same behaviour before, with the traditional canvas so I guess this is an intensive undertaking for the renderer.
But why am I seeing this jank on the main thread!? I’ve had a look through Chrome’s Memory tab but I must confess I don’t really know what I’m looking at in there. I can’t share a demo, unfortunately because the project is commercially sensitive and still in R&D, but can anyone shed any light at all on what on earth is happening please? Or perhaps point to me how I might be able to see separate memory threads in Chrome’s dev tools? Perhaps my web worker has simply max’d out its thread?
Thanks so much for any pointers