xvrh / lottie-flutter

Render After Effects animations natively on Flutter. This package is a pure Dart implementation of a Lottie player.
https://pub.dev/packages/lottie
MIT License
1.16k stars 196 forks source link

CPU Utilization #220

Open jonbhanson opened 2 years ago

jonbhanson commented 2 years ago

The package is great, thanks for your work in implementing it!

Sadly, though, I seem to be experiencing high CPU utilization as a result of using the package.

To reproduce, I used this example Lottie file: https://assets3.lottiefiles.com/packages/lf20_guwqiaxe.json. I dropped it into the default Flutter app and ran it on MacOS, and it consumes 20-25% of the CPU on my M1 Macbook Pro.

letungcntt commented 2 years ago

same problem

LuoLuoDev commented 1 year ago

same problem + 1

ZhongHaoHero666 commented 1 year ago

same problem + 1

zhangc20 commented 1 year ago

same problem + 1

xvrh commented 1 year ago

If an animation is costly to draw, there is the possibility to draw all the frames in a List<Image> and keep them in memory. After the initial cache warmup, it's almost free to draw each frame. It will consume more memory but it can be an acceptable trade-off.

Here is an example of that technique: https://github.com/xvrh/lottie-flutter/blob/master/example/lib/examples/draw_cache.dart

zhangc20 commented 1 year ago

Also High CPU usage

xvrh commented 9 months ago

The next version v3.0.0-alpha.1 has an experimental parameter enableRenderCache which is meant to make the rendering very cheap for the CPU in exchange of an increased memory usage. Give it a try and report your experience.

jeslinjacob1995 commented 8 months ago

please help same issue CPU utilization shoots to 100%

xvrh commented 8 months ago

@jeslinjacob1995 can you try v3.0.0-alpha.4 with the renderCache parameter and report with more information.