shivammak Posted April 19, 2023 Share Posted April 19, 2023 All images are flickering while animating them with scale property of gsap Here's the working Stackblitz URL => https://stackblitz.com/edit/react-ts-hzgsvj?file=App.tsx This is happening on every Chromium browser (Chrome, Edge, Brave) Working fine on Safari though🤨 Link to comment Share on other sites More sharing options...
GreenSock Posted April 19, 2023 Share Posted April 19, 2023 Hm, I don't see any flicker at all in Chrome.  I did notice that you're using React but you're not doing proper cleanup which is a bit dangerous in React because in React 18 and above, it DOUBLE-invokes useEffect()/useLayoutEffect() in strict mode so you might be inadvertently creating duplicate/conflicting animations/ScrollTriggers. I'd strongly recommend reading this article:  gsap.context() is your new best friend in React.  You can also try setting will-change: transform on the things your scaling because sometimes browsers do funky stuff rendering-wise (totally unrelated to GSAP) and perhaps that's causing the flickers on your device. Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now