I’m testing out performance on rapidly adding and removing 100s objects to a scene on scroll. I initailly thought disposing the objects would save memory and make things faster. However, it appears faster to not remove any objects at all, and a little faster than that to call remove() instead of dispose()
I have an example here you can test by scrolling the page.
What would be the reccomended approach to load and unload these objects as quickly as possible? And what are the consequences of not calling dispose()? Will that cause performance issues in the future?
Note: I’m not using instancedMesh because I need the objects to be interactive and have different materials in the future.
Could you show/hide them instead of adding/removing ? That’s a lot faster.
You can set the .visible property of these objects, or put them in layers depending on your use case.
You should maybe tell us more about what you intend to do. Of course not removing object cause memory issues if you keep adding new objects. What I mean is : if you have a fixed pool of object that you need to show/hide, you had better adding everything to the scene, and then set their .visible property instead of adding/removing from the scene.
Yes, the goal would be to, as flawlessly as possible, scroll through an potentially infinite amount of objects. Dynamically loading and unloading them when needed.
Perhaps I should test loading in and out a smaller amount of objects rather than selecting from a very large predefined array…
Uploading a new geometry to the GPU, compiling a new material, or uploading a new texture all have upfront costs before an object can be rendered. Try to reuse objects from a pool rather than actually creating new objects infinitely – that’s how “infinite scroll” is usually implemented in non-3D apps too.
If you’re not sure how to do that while keeping the effect you want, try to isolate where you’re losing performance. If you use the same material for every object, what happens? Or the same mesh, but different materials? Are you using textures? From a quick look at the code, it appears you might be reusing meshes but have a lot of unique materials. I wasn’t able to see anything rendered though, just a white screen in Firefox for me.
