Hi,
I am facing a weird bug. My friend made a model of coffee making simulation in blender. Basically main agenda was to pour liquids in coffee liquid to create a coffee simultion. But it looks like there are huge frame drops while animation. Like when the animation starts first comes in front as soon as it lifts up it causes huge fps drops like from 70-80 to around 30 can easily be seen. Also there is cup cream , when its poured in glass it show some weird flicker glitch. I dont know Whats causing this issue even my scene is not that heavy. Stats are also fine not that high. Poly count is around 60k. Draw calls is also around 100. Cant decrease quality of models. Camera will be mostly fixed for simulation. we can move in development if needed.
Main platform for deployment are mobiles not desktop.
My theory
I think Blendshapes are causing this issue. As soon blendshapes from keyframes starts to animate lag starts. I dont if there is some sort of bug in babylon gltf loader or animation player. Seems like babylon animation player is unable to handle animation. I have also tested in three js but it seems there fine. But I really like to stick with babylon.
IMPORTANT :- Please run it on mobile devices for checking lag, desktops may not show lag issues.
Marked points in the below image show issue points can be seen when running in realtime
The hicups you experience is because of shader recompilations.
That’s because we optimize the shaders to only use targets (blendshapes) that have non-zero influence (=active targets), but in your animation, the number of active targets changes, which triggers a shader recompilation.
You can disable this optimization by setting mesh.morphTargetManager.optimizeInfluencers = false. However, for this change to trigger a recompilation at the start of the program, you will have to do:
That seems silly, but the second line will trigger the required processing because of the first line.
Here’s a fixed PG:
Regarding the rendering artifacts (flickering, animation misbehaving), I don’t experience them on my iPhone SE. Maybe there’s a hardware limitation somewhere: do you get some errors in the console log of the browser?
There is one more device I remember in which web page was crashing. Tried to load without animation it was opening. But with animation, page was crashing i dont know why. I am waiting for logs he said he will send it by tomorrow.
It is disabling the texture support for morph targets. I also had to lower the maximum number of targets (line 4), but it does not seem to impact the rendering.
It’s probably because of the reduced number of targets… Try to raise the value of MaxActiveMorphTargetsInVertexAttributeMode => it seems setting the value to 5 does work.
Can you check this PG why mesh is getting distorted, coffee mesh is coming out of glass. Else everything is fixed IG. Its now working on all phones perfectly but above issue is coming.
Also I tried to above 6 but getting error . I think 6 is the limit.
I don’t see this problem on my computer with MaxActiveMorphTargetsInVertexAttributeMode=5, and the color is black. Are you experiencing this problem only on the low end devices?
Unfortunately, you may have to set optimizeInfluencers back to true to make it work (you should try MaxActiveMorphTargetsInVertexAttributeMode=5 and optimizeInfluencers=true).
Yes, but unfortunately I don’t see any other solution at the time… We would need to handle the number of active targets as a uniform variable instead of using a define, to avoid recompiling when the number of active targets changes… cc @sebavan for his expertise!
@sebavan Can you help regarding this? I am facing issues with animations playing with blendshapes. I just checked some animation details are missing here right now and some sort of glitch too in some last frame as mentioned in upper messages.