As we know, it's often advised to debounce scroll listeners so that UX is better when the user is scrolling.
However, I've often found libraries and articles where influential people like Paul Lewis recommend using requestAnimationFrame
. However as the web platform progress rapidly, it might be possible that some advice get deprecated over time.
The problem I see is there are very different use-cases for handling scroll events, like building a parallax website, or handling infinite scrolling and pagination.
I see 3 major tools that can make a difference in term of UX:
So, I'd like to know, per usecase (I only have 2 but you can come up with other ones), what kind of tool should I use right now to have a very good scroll experience?
To be more precise, my main question would be more related to infinite scrolling views and pagination (which generally do not have to trigger visual animations, but we want a good scrolling experience), is it better to replace requestAnimationFrame
with a combo of requestIdleCallback
+ passive scroll event handler ? I'm also wondering when it makes sense to use requestIdleCallback
for calling an API or handling the API response to let the scroll perform better, or is it something that the browser may already handle for us?