Reduce jitter on GSAP animations.
Hey @Web Bae I noticed that some of my GSAP animations such as a horizontal marquee, tend to jitter / lag a bit when on mobile. I was wondering if you had any tips on reducing this lag and optimizing performance. I understand certain that CSS properties like drop shadows and filters can cause performance issues, but I was more curious if there were some GSAP utility functions or other JS-based solutions that could improve performance. Thanks!
12 Replies
Hey @sungdukkang - can you link to the code you are using? Is it my code? lol
one thing to look out for is animating properties like left instead of x
i.e. you should animate x (translateX) and not left, which snaps to whole pixel values
GreenSock
Continuous News Ticker with pause on hover?
Hi there. I was looking at this thread: Wondering how the example might be modified to allow for items to pause on hover so a link can be opened. See the Pen ZPKwjW by sgorneau (@sgorneau) on CodePen
you can also look at using force3d:true and rotationz
GreenSock
Jittery animation with slow moving images
Hi there, I'm trying to create a smooth animation of an image panning across the screen but it seems to be be moving pixel to pixel. I have force3D set to true but perhaps I'm doing it incorrectly. Can anyone help? Here is the Code Pen See the Pen tGLfC by anon (@anon) on CodePen
is there a way i can paste code snippets on discord?
good question lol
I'm not a discord pro
but I'm working on it!
haha me neither
looks like you can use three backticks?
this is the script i'm using
thanks - not sure form first glance
is it on iPhone?
android?
I notice worse performance on my iPhone if in low power mode ()
usually battery <20% but I think it's customizeable
might be a good question for the gsap forums though
Yup yup