Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Three.js - BinaryLoader vs. BufferGeometry for large meshes?

I'm looking for a most efficient way to load large polygonal meshes (up to 1M triangles) to Three.js. I'm considering either using a THREE.BufferGeometry object or loading with THREE.BinaryLoader. My questions are:

  • Does BinaryLoader.js create a THREE.BufferGeometry object underneath? Or does it create something similarly efficient?
  • If not, does anyone have a recommendation which one to use?

Some additional info:

  • My models are in a proprietary format on the server, so I need to convert/encode them anyway.
  • I haven't found a Three.js loader that creates a THREE.BufferGeometry. It looks like I need to write my own. But I can prepare the data on the server side to be aligned with THREE.BufferGeometry structure.
  • BinaryLoader.js provides all necessary infrastructure for loading data, but requires data to be prepared in a special way on the server side.
like image 209
Simon Avatar asked Nov 03 '22 21:11

Simon


1 Answers

Take a look at glTF format and glTFLoader for Three.js. It uses BufferGeometry. Performance is much better; however, it has its own animations implemented (doesn't use THREE.Animation) and I've ran into a few Three.js related problems like cloning the model won't work (at least out of the box)

glTF: https://github.com/KhronosGroup/glTF

glTFLoader: https://github.com/mrdoob/three.js/blob/54a1e789c3a84557d6b05782f5cbd9f1064f5e4f/examples/js/loaders/GLTFLoader.js

like image 50
Yasha Avatar answered Nov 20 '22 12:11

Yasha