-
Notifications
You must be signed in to change notification settings - Fork 5
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
High CPU load #180
Comments
@hermet Yes, I'm experiencing performance issues on the site. The animations, other than Lottie, and the SplideJS slider are twitching. Overall, the site does not feel smooth. |
@theashraf Please double-check first if there are areas to improve in dotLottie side, and let us know if it needs thorvg help, thanks. |
@nauorama Consider disabling frame interpolation: new DotLottie({
canvas: canvas,
src: src,
loop: true,
autoplay: true,
useFrameInterpolation: false,
}); Adjusting the new DotLottie({
canvas: canvas,
src: src,
loop: true,
autoplay: true,
useFrameInterpolation: false,
renderConfig: {
devicePixelRatio: 1 // Lower values improve performance but may reduce animation quality
}
}); You can experiment with different values for renderConfig |
@theashraf I tried useFrameInterpolation and devicePixelRatio setting. The CPU load is a little bit better, but still very high. |
@nauorama I'm investigating whether there are any additional optimizations we can introduce |
@nauorama One final optimization we could introduce is offloading the rendering to a web worker. I've created an example to show how you can run dotLottie in a web worker. You might want to consider it. Let me know if you encounter any issues. |
@theashraf thank you, I will try it |
I have the same problem with the @lottiefiles/dotlottie-react package, my CPU usage goes up to 100% and stays in the 90% range when switching to different pages where the animations are, by refreshing the page my CPU usage goes back to 1%. |
I think it's a good idea to share the ThorVG team performance benchmarking results between dotlottie-web (ThorVG) and lottie-web here. So far, dotlottie-web has shown better results in terms of memory consumption and FPS. You can check it out at https://thorvg-perf-test.vercel.app/. @lyorb The performance depends on many factors such as devicePixelRatio, canvas size, animation features utilized, etc. There are some micro-optimizations that can be applied to dotlottie-react:
We're currently working on worker support for dotlottie-web and its wrappers. You can track the progress here: #203 |
Overview
Hello. I was trying to implement animations on a site and noticed that dotlottie-web causes a huge CPU load. You can check it here: https://codepen.io/nauorama/full/LYvJOrZ. This doesn't happen with the @dotlottie/player-component library using the same animations. Can you help, please?
The text was updated successfully, but these errors were encountered: