realityendshere / emberella

A collection of Ember mixins, helpers, views, and controllers developed for my own projects that might offer use or inspiration to other budding Ember developers.
MIT License
251 stars 25 forks source link

Scrolling abruptly stops while momentum scrolling list view #6

Closed jmonma closed 11 years ago

jmonma commented 11 years ago

If you're viewing a long list of items, and you use the mouse to scroll quickly through, the momentum scrolling will halt suddenly sometimes.

This issue does not occur if your mouse is hovering over the scroll bar while scrolling.

This issue also does not occur on either ember-table or ember list-view, so it seems to be something introduced in this iteration.

Examples for reference: http://addepar.github.io/ember-table/ http://emberjs.com/list-view/

realityendshere commented 11 years ago

In any case, temporarily disabling pointer events on list item views as the user is scrolling significantly boosts performance.

Here's what seems to be causing the abrupt stop to inertial scrolling:

DOM elements in list item views become the recipient of mousewheel events, including events sent by OS X's inertial scrolling mechanism. Since each listing and its children are unlikely to allow scrolling themselves, the inertial scroll events cause the entire page content to "hit the edge" and perform the "rubber band" effect rather than continue scrolling the list view.

Disabling pointer events on list item views while the user scrolls allows mousewheel events to continue firing on the scrollable element as expected. Pointer events are re-enabled 30ms after the last change to scrollTop to allow the user to interact with list items again. This seems to be long enough to maintain inertial scrolling and short enough to reduce the chance a user will, for example, try to click a listing before pointer events have been re-enabled.

Give it a try and report any new issues that arise from this fix. Thanks.