airbnb / lottie-web

Render After Effects animations natively on Web, Android and iOS, and React Native. http://airbnb.io/lottie/
MIT License
29.85k stars 2.85k forks source link

lottie image flicker when animation is playing #3031

Open MMMarcinho opened 10 months ago

MMMarcinho commented 10 months ago

my environment

I try to play a Lottie animation, in SVG, on an Android 9 phone. When the page had a lot of content with Lottie animation playing, there was flickering of the images in lottie. Upon recording the screen, I noticed that some in the SVG were flickering, which was not expected. The flickering occurred consistently for about 1-2 frames. Using USB debugging with Chrome, I examined the structure of the playback state in the devtools and found that during the flickering, the styles (size, visibility, opacity) of the did not change. Only the images within the Lottie animation on the page were flickering.

I attempted to select the tags in the devtools, but when I did so, there was no flickering visible in the devtools preview (although the flickering continued on the phone). I am puzzled as to what could be causing this issue.

rigby00 commented 8 months ago

I have same issue. I'm testing it on IOS there is no problem but in Android devices it's flickering. Any way to fix it?

QingwangLi commented 7 months ago

Is there a solution to this problem? It works fine on iOS, but there is flickering on some Android devices.

FruitJ commented 6 months ago

这个问题有解吗?我也遇到了 ...

lbmausky commented 5 months ago

This problem seems to only occur on android devices. The reason may be that too many lottie animations are placed on the same page. Possible solutions include downgrading to css animations or giving up other animations for this more important one.