Here's a WebGL+WASM experiment I did a little while ago, all object positions are CPU updated. It goes to a million objects at 60Hz without breaking a sweat on the desktop machine I'm testing here (1 million is where the demo stops adding objects), all very simple and straightforward single-threaded code.
There are some stuttering frames every 300k objects or so, I guess this is when WebGL needs to grow buffers under the hood. Hoping for WebGPU to fix those problems.
No matter how you look at it, moving a few thousand things around on screen really isn't all that impressive, you just have to know the weaknesses of the platform (WebGL's is a high draw call overhead) and work around them.
Amazing. My MBP/Firefox still had 50% idle with a frame request every 8.6ms at 1M particles. React is a bit of a resource hog, and all the article shows is that modern processors are really powerful.
This is the only answer I've found in this thread that actually demonstrates the point everyone is making, it's buttery smooth on my iPhone SE (!) up to 300k elements.
Indeed, but we're not even talking about WebGL's high draw call overhead (that overhead is constant between all the demos!), just the overhead of updating ThreeJS's view of the world on the main thread, which should be a matrix mul at the most. The rest of the overhead from ThreeJS rendering, and from WebGL, that's the same in both demos!
Matrix multiplication should not have to be scheduled!
There are some stuttering frames every 300k objects or so, I guess this is when WebGL needs to grow buffers under the hood. Hoping for WebGPU to fix those problems.
https://floooh.github.io/oryol/wasm/Instancing.html
No matter how you look at it, moving a few thousand things around on screen really isn't all that impressive, you just have to know the weaknesses of the platform (WebGL's is a high draw call overhead) and work around them.