search

software-mansion / react-native-reanimated

React Native's Animated library reimplemented
https://docs.swmansion.com/react-native-reanimated/
MIT License
8.59k stars 1.26k forks source link

[Web LA] Fix chrome flickers #6172

Open m-bert opened 4 days ago

m-bert commented 4 days ago

Summary

Currently some of our animations flicker on google chrome browser. This PR moves setting animation into requestAnimationFrame callback - this way we will be sure that animation will be properly set before next repaint.

Comparison

Before

https://github.com/software-mansion/react-native-reanimated/assets/63123542/fe674d23-d1bb-44c3-a870-335c330c7073

After

https://github.com/software-mansion/react-native-reanimated/assets/63123542/2a4833a7-c3d9-4a59-b108-a7f4cc166f1f

Test plan

Tested on default animations example