Lottie 3.4.0 is now available! This release adds a new rendering engine that uses Core Animation instead of animating on the main thread. This significantly improves animation performance while also eliminating CPU overhead.

Lottie’s original rendering engine played its animations on the app’s main thread. Once per frame, Lottie advanced the progress of the animation and re-rendered its content. This meant that:

• Animations would consume 5-20%+ of the CPU while playing, leaving fewer CPU cycles available for the rest of the application.
• Animations would not update when the main thread was busy, which could cause animations to drop frames or freeze entirely.

Playing a Lottie animation with the original Main Thread rendering engine

Lottie 3.4.0 includes a new rendering engine that addresses these issues and significantly improves performance. The new engine leverages Core Animation to render out-of-process with GPU hardware acceleration. Once animations begin playing, they do not consume any of the app’s CPU resources, and are effectively guaranteed to animate smoothly regardless of CPU load:

Playing a Lottie animation with the new Core Animation rendering engine

In Lottie 3.4.0, the new Core Animation rendering engine is opt-in, configured by a feature flag (LottieConfiguration.renderingEngine). In a future major version of Lottie, we plan on enabling the new rendering engine by default.

Due to limitations of Core Animation, not all Lottie animation features are supported by the new rendering engine. Lottie includes a RenderingEngineOption.automatic option, which detects if an animation can be played correctly using the new rendering engine and otherwise falls back to the legacy main thread rendering engine. In most cases, enabling RenderingEngineOption.automatic should not result in any user-facing behavior changes other than improved performance.

You can enable the new Core Animation rendering engine globally in your app, by configuring the LottieConfiguration.shared singleton:

// Use the Core Animation rendering engine if possible,
// otherwise fall back to using the Main Thread rendering engine.
//  - Call this early in your app lifecycle, such as in the AppDelegate.
LottieConfiguration.shared.renderingEngine = .automatic

or you can enable the new Core Animation rendering engine for an individual AnimationView:

let animationView = AnimationView(
  animation: ...,
  configuration: LottieConfiguration(renderingEngine: .automatic))

Please try out the new Core Animation rendering engine, and let us know how it goes!

If you enable RenderingEngineOption.automatic and find that your animation no longer renders correctly, please file an issue with your animation json. Ideally all animations will render correctly using RenderingEngineOption.automatic .In a future major version of Lottie we’d like to make this the default behavior, so nailing the automatic compatibility detection will be especially important.

There are some advanced AnimationView features and methods that are currently not supported by the Core Animation rendering engine (such as some types of advanced value providers, and some operations that rely on animation key paths). If you actively use these methods and would like to adopt the Core Animation rendering engine, please file an issue with your use case. Pull requests are welcome as well (and much appreciated)! Feel free to reach out if you’d like tips on how to get started.

3.4.0 includes several other new features and lots of bug fixes. You can find a full changelog here.