Texture UV animation is very slow

Texture animation (via uOffset, vOffset, etc.) is very slow since it causes the materials to be flagged as dirty. Setting scene.blockMaterialDirtyMechanism to true will make the speed much faster, but disabling this globally has potentially undesirable side effects for the rest of the scene. And assigning blockMaterialDirtyMechanism to true just before the updates and then reverting to false afterwards is not viable since this causes all materials to be flagged as dirty.

Is there some way to allow fast UV updates without having to force blockMaterialDirtyMechanism to be true globally for the entire duration of the scene? Technically I think the private field _blockMaterialDirtyMechanism could be manually updated, but this is not a stable solution.

Demo (change the mode parameter):

Hi @kvbh - Thanks for the playground example. Have you tried looking at Procedural Textures? You can create animated textures using in the Node Material Editor with Node Material Procedural Textures (checkout the second half of the video). Looping in @sebavan to see if he has another idea.

Yeah unfortunately this has side effect potentially impacting quite a lot the shader creation :frowning:

@Deltakosh any quick idea on how to solve the perf there ?

Animating the uvs using a custom shader seems to be faster, not quite 60 FPS but might be helpful? Slow texture UV Animation | Babylon.js Playground (babylonjs.com)

I’m not available for a while but if you can create an perf issue for me on the repo I will gladly investigate next week :slight_smile:

Here it is: Texture UV animation performance · Issue #12987 · BabylonJS/Babylon.js · GitHub

You can store the new uOffset value directly in the matrix instead of setting the uOffset property:


Thanks @Evgeni_Popov!

@kvbh - Does this playground from Evgeni answers your question?

Yeah I think that’s a decent solution for my case. Since it’s an immediately obvious solution, it might benefit from some discoverability in the docs somewhere.



Here is a proposal to make that less hacky :slight_smile:
Fix #12987 by deltakosh · Pull Request #12995 · BabylonJS/Babylon.js (github.com)