What is the best way to update many indices?

I’m updating a wireframe that changes its geometry often…
The problem is that when I call indexWireframe.needsUpdate = true; I noticed a drop in performance.
I’ve allocated a size to the mesh, and I set the drawrange: geometryWireframe.setDrawRange( 0, indexPosWireframe );
I was under the impression this would improve performance. I need it to go faster though.

			geometryWireframe.toNonIndexed();
			attributesWireframe.position.needsUpdate = true;
			indexWireframe.needsUpdate = true;
			geometryWireframe.computeBoundingBox();
			geometryWireframe.computeBoundingSphere();
			
			geometryWireframe.setDrawRange( 0, indexPosWireframe );

Is updating the index the same as creating a new geometry? I’m assuming it is faster than creating a new geometry, but I’m not sure.
Is there a way to improve the performance in this case?

edit: here is example of the issue: https://jsfiddle.net/h6zu982e/9/

1 Like

Sorry, but it is not clear to me what you are actually doing in your code. Do you mind sharing a complete live example?

https://jsfiddle.net/h6zu982e/9/

I tried to make an example… I’m not sure why there are those errors in the console though…
Anyways- that’s the gist of what I am doing. Maybe there is a more performant way to do this?
As the object count becomes higher, the performance decreases, thus why I tried to combine the wireframes into one object. The objects can be all different shapes and change form often.

edit: Also, I’m aware of the createMultiMaterialObject option to share a geometry, however that would create more draw calls and slow down rendering. What I need is a way to have one geometry that is a construct of multiple geometries, and keep it updated as fast as possible.