search

janpaepke / ScrollMagic

The javascript library for magical scroll interactions.
http://ScrollMagic.io
Other
14.9k stars 2.17k forks source link

Google Chrome (v71.0), threaded scrolling, and ScrollMagic jitter #866

Open gooselord-0 opened 5 years ago

gooselord-0 commented 5 years ago

Possibly related to issue #858 and others listed in #660.

The Problem

  1. Pin a section (it should have some content) that isn't at the top of the page. Doesn't matter if you use triggerElement or a combination of duration and offset.
  2. Tween some elements (using the GSAP plugin) within the pinned section.
  3. The pinned section will jitter terribly when scrolled on Google Chrome (tested on v71.0, MacOS), but not on Safari or Firefox

The (Partial) Solution

Visit chrome://flags/#disable-threaded-scrolling in your browser. Make sure the threaded-scrolling flag is disabled. According to Google, threaded scrolling offers:

Threaded handling of scroll-related input events. Disabling this will force all such scroll events to be handled on the main thread. Note that this can dramatically hurt scrolling performance of most websites and is intended for testing purposes only. – Mac, Windows, Linux, Chrome OS, Android

This fixes the problem completely, though it's obviously not a viable long-term solution. Hopefully it offers some insight to the devs?

krnlde commented 5 years ago

What about the scroll event in passive mode? Same results?

jfarellano commented 1 year ago

Hello, might not be of any help but I have been dealing with a website that was rendering on scroll poorly on Apple M processors. Just discovered this feature was the cause of my problems. Maybe check performance on this devices.