Project lag issues on ThreeJS

Hi everyone, I am having an issue on ThreeJS with my .GLB file lagging when navigating the 3D model.
The 3D project was initially created in Blender. It was then exported in .GLB and imported in ThreeJS through the class GLTFLoader. To manipulate the file, I use .TS (Typescript). Also, to be noted that the textures embedded in the .GLB file was optimised to the maximum (file size from 165mb to32b) but unfortunately I am still getting lag issue in the GLTFLoader. Can someone please advise where the problem is coming from and suggest a solution? Thanks.
Here is the capture for the performance, I checked in the site https://gltf-viewer.donmccurdy.com/
MicrosoftTeams-image (13)

Optimize your textures and model again! Try exporting your textures to jpg instead of “auto” (see exporting settings in blender under Geometry, for some strange reason …)
Other reasons could be you render cycle. Also if you are running a render loop, make sure you’re not calling render from somewhere else aswell. Trying to run more than 60 fps (or whatever you’re set-up allows) will make threejs choke.
For more optimisation tips, publish your code :wink:

DUDE, Thank you man. You solved the issue, I realized I had called the animate() function about 36 times in my code, in multiple loops. Much love to you bro!

1 Like