Baked Texture Animations to Reduce CPU Usage with Many Concurrent Animations

I have a method in my project that plays animations and handles transitions from playing animations to new ones. It utilizes Babylon’s AnimationGroup and works with several checks and conditions to handle looping, last played animations, walk animations, etc.

However, I’ve noticed that when running more than 30-40 animations concurrently, the CPU usage becomes a significant concern. I’m looking to optimize this by possibly using baked texture animations.

Here’s my existing method for playing animations:

private play_animation(entity: entity, ag: BABYLON.AnimationGroup...): void {
  // (Code...)
  entity.animateTransitionTo(ag); //Utilizes setWeightForAllAnimatables for the weight shift.
}

My question is it feasible to convert the existing play_animation method into a baked texture animation within Babylon.js? While keeping existing logic (such as transitions handled by animateTransitionTo ) while utilizing baked texture animations?

cc @Evgeni_Popov

No, baked texture animations are more limited than normal animations; you can’t have several animations applied to the same mesh at the same time, so you can’t have transitions (unless the transition is an animation itself and not a blend!). What’s more, there’s no interpolation between frames, so the animation may appear a little choppier, depending on the framerate.

You may find this thread interesting, as @oriongu had the same problem as you:

And the doc:

1 Like