Jump to content
Search Community

Laggy Scroll Animations

smallio test
Moderator Tag

Recommended Posts

Hi all, I just wondered the best practices when using Scrolltrigger and any smooth scroll library?

 

I appreciate you guys want isolated code examples but due to the nature of this problem being sitewide I can't really do that. I'd really appreciate a bit of insight on how to make scrolling interactions less laggy in general. All I'm really doing is using a bunch of scroll triggers, nothing complicated and under 250 lines of code so really it should not be lagging. I don't need someone to fully audit the code or anything, rather I'd appreciate if someone could just have a quick look in the inspector and see if there's anything standing out that's causing my issues.

 

I've come up with a few things that could be causing the problem.

- Image size

- RAF triggering too much

- Not using dynamic scroll triggers with "for each" etc 

 

Here's my site i'm using scrolltrigger x asscroll - 

https://scrollablegsapdemo.webflow.io/

Link to comment
Share on other sites

4 minutes ago, Cassie said:

Hey there!

 

Some of your images being around a MB in size would be my first guess. The site seems to be perfectly smooth on my device though.

If you're struggling with IOS, it may be worth trying out ScrollSmoother to see if it works for your use case any better?

https://greensock.com/scrollsmoother/

 

 

I'll try the smooth scroller as well :)

  • Like 1
Link to comment
Share on other sites

ScrollTrigger pre-calculates positions and then just checks against those values, so the issue won't be the ScrollTriggers themselves. ☺️

 

from the docs...

 

Quote
  • Highly optimized for maximum performance - scroll events are debounced, updates are synchronized with GSAP and screen refreshes, resize recalculations are throttled, etc.

 

Link to comment
Share on other sites

2 minutes ago, Cassie said:

ScrollTrigger pre-calculates positions and then just checks against those values, so the issue won't be the ScrollTriggers themselves. ☺️

 

from the docs...

 

 

 

Awesome, just watched your little video on it. Great work, I've been waiting for GSAP to natively make a smooth scroll library. Have not been on the forums in a few years and super happy to see you guys have finally done it! Going to give this a run now. 

 

Also great demonstration, super clear.  

  • Like 1
Link to comment
Share on other sites

4 minutes ago, PointC said:

I thought that name sounded familiar. Welcome back and good to see you again @smallio. :)

 

Where have you been hiding the last few years?

 

Haha cheers Craig, working a lot mate! Setup a few businesses (which I 100% could not have done without learning GSAP - Big love to the team), and now back to really dive deep now I have a bit more time and things are running smoothly :) Hope you're well mate, how is everything your end?

  • Like 2
Link to comment
Share on other sites

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 account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...