My problem is quite simple. I had a mesh I created that I uploaded to Mixamo and then downloaded the skinned mesh in a TPose and all the unskinned animations I wanted. When I imported it to the Three.js scene it ran amazingly (144fps on my PC, 60fps on my phone).
Later I had to change the base mesh and add 2 low-poly pickaxes and books using blender (each had one bone with one parent that just copied the transformations of the parent). The problem starts here, as the material seems to have changed from the model taken straight from Mixamo and the performance dipped tremendously (40-80 fps on my PC, 10-20 fps on my phone).
I only added a very small amount of polygons to the mesh, I suppose it’s something to do with blender export/import settings but I don’t have the slightest idea what could be causing it.
Thank you for reading, hope you can help!
PS.: Everything is saved as an fbx as mixamo does not support gltf
This sounds very weird! Any chance you could share a demo before/after?
I have a demo of how it works after!
What I can say is the previous version ran at those framerates, loaded very fast and the model itself seemed to be more “matte”, as in less shiny. If you walk with the character to the icewall you can see all the moving lights shine on the characters face.
(the ui is not build yet, so the important controls are:
wasd - move
space - to start and also to jump)
PS.: I do not know if there is a way to make a simple preview of how it was previously as this project takes several fbx files and sound.
I’m seeing FBX files on that link, and it’s running about 120 FPS for me - is that what you expect?
It’s worth noting that FBXLoader uses different material types than GLTFLoader. GLTFLoader usually creates MeshStandardMaterial, and may create MeshPhysicalMaterial under some circumstances. In order of cheapest to most expensive:
Especially with a lot of lights, MeshStandardMaterial will be very expensive. I’d replace the material after loading if you need something cheaper.
I was checking which material its actually using, and it’s a PhongMat, which only makes everything more confusing. I will investigate a bit more but this is all a bit confusing to say the least.
Before I say anything else, just a bit of context. The original model was made in blender, meshes only. They had a sort of hierarchy, where meshes belonging to the face were presented as its children. Then it was exported to mixamo and redownloaded but now as a skinned mesh (this is the “good performing” one). Then, because I wanted to add the equipments, I imported the skinned mesh to blender and added the 4 items with one bone each and exported again (this is the badly performing one).
So, upon further inspection this is what I found:
- The file sizes vary a lot. The mixamo version is 1.20Mb while the badly performing one (ill call it blender version to make things easy) is 3.12Mb. Their only difference should be adding two 40Kb files (books) and two 100Kb files (pickaxes) with their respective single bone. Both versions are just the skinned mesh Tposing.
- I tried re-importing the blender version to mixamo to then export again, to see if there were some specific settings being changed and I found that the material is indeed different, if I console log it it is a PhongMat but has some tweaks under the name of “semi-rough” material. Sadly this had no effect on performance whatsoever. This file also was much larger than the original mixamo version but lesser than the blender version, at 2.95Mb. I am guessing it had to do with bone structures as they rearranged it a bit while everything was kept functional.
- Your performance probably was due to using chrome, when I tested it there my fps were averaging 130 but they had stutters and dips sometimes, which didnt happen in the other version.
I will push the “good performing” version temporarily for you to take a look as it might give some insight. This is messing with me a lot and I’m on a tight schedule as this is my Thesis project and I have to finish it asap t-t
Thank you for your help! Please let me know when you take a look for me to revert the changes.
PS.: I have found something much more important I believe.
I believe the tunnels and their contents (the transparent walls with text) are actually at fault here, as the performance breaks only happen when I look in that direction (even if I cant see them, for example in the starting room) where my fps dip from 144 to 85. Maybe something can be done regarding only rendering stuff that can be seen? Honestly I’m at a loss for why this whole thing has such performance issues, even if this specific problem doesn’t get solved, I’d greatly appreciate some tips regarding how to optimize this to the point of running at stable 60fps on not top-end mobile devices.