CODEWITHSUNDEEP
three.jswebgl
Robin Hawkes
Robin Hawkes

Reputation: 708

Fastest method to load a large number of objects in Three.js?

I'm currently exploring methods of optimising the time taken to load / generate a large number of objects in Three.js. The input for these objects are individual vertex points that make up a 2D footprint.

The initial method I used is to create THREE.Shape objects from the individual vertex points and then use THREE.ExtrudeGeometry to pull the 2D shape into a 3D object. Doing this for all objects takes around 3500ms.

A second method I've explored is to pre-export the generated 3D objects (from the previous approach) into a JSON file using the JSON model format, then import that JSON file when needed instead of generating the objects at runtime. Just the import and loading of this JSON representation takes around 3800ms, which is longer than generating the objects at runtime!

I'd like to know what the fastest method is for loading / generating objects in Three.js. I'm at a loss at how to speed up the THREE.Shape and extrusion approach, and I'm not sure why the JSON import approach is so slow (I assumed pre-generating the geometries would save a lot of time).

Are there any other methods that might speed things up?

Upvotes: 1

Views: 3260

Answers (1)

rossmckegney
rossmckegney

Reputation: 460

I'm not at all surprised by your results. I'd bet that you also get a much larger memory footprint with the custom geometry as well...

BufferedGeometry would definitely speed up loading the custom geometry. But I'm not sure you'll get faster than generating the geometry on the fly. And the benefit of the generation is that you can animate the process, so that the user sees the scene come to life in front of them. You can break your custom geometry down and do something similar to what we do when we load multi-part objects in Verold Studio, to give a similar effect, but you'll have a lot more control with the generated scene.

I'd also suggest you look at memory, CPU, and network speed in your benchmarks. Optimizing for your specific configuration might lead you down a path that gets you great performance, but not for your users. There are definitely tradeoffs in approach, where you can do more pre-computation on the server in exchange for more network traffic, etc. Make sure you're measuring all the factors independently - not just the speed on your configuration.

Upvotes: 2

Related Questions