#Size limit of 3d models for optimal performance on website

9 messages · Page 1 of 1 (latest)

wicked swift
#

I am building a website which contains multiple 3d models with different animations. What should be the ideal size of all the models collectively to ensure that the site loads faster and gives smooth user experience.

The next question is pretty silly but is it the case that all the 3d models are loaded entirely before loading the website or anything else?

I am looking into draco compression a bit too to optimize file size but are there any generic techniques to ensure smaller size of the 3d models?

#

Size limit of 3d models for optimal performance on website

silk summit
#

gltf-transform optimize ftw!

#

If the GLTF has animations (morphTargets), meshopt does a much better job at compressing than draco

stiff oxide
#

...is it the case that all the 3d models are loaded entirely before loading the website or anything else?
Not necessarily, but this would depend on how you build your website. Usually you would display a placeholder or loading indicator while waiting for models to load, and let the rest of the page go ahead and run.

#

You might have a look at https://modelviewer.dev/ for a website with many 3D models, it does some clever things to handle many separate 'canvases' without actually having many canvases and WebGL contexts involved, and is pretty easy to set up.

spare bobcat
#

with models imo

  • the less polygons the better
  • compress in some way
  • the lighter the materials the better
  • the smaller file size the better
  • do as much work/deletion/decimation in blender as possible
  • any code like translation/move/useFrames that touch models should be carefully implemented
  • shadows, computations, etc minified

I have a startup called OT Sketch, I did models over and over to I got like 200-300fps

silk summit