ftlabs/ftscroller — pull request #57 by kaij (2013-08-07 15:06:16+00:00)
Title: Performance tweaking for large container content structures

I think I have to explain a little bit why I wrote this patch: using an iPhone4 device, there always was a noticeable performance lag just before scrolling. It's like a delay after touching and before the scrolling begins. This did not occur in the examples.

Analyzing this lag, I noticed two things: first, I had several CSS * selectors, second, the content structure being scrolled is quite large. Removing the * selectors seemed to solve the problem, but it came again when the structure was yet larger (using infinite scrolling with ajax).

Then I did further analysis within the Chrome Timeline which showed that styles are being recalculated for all container elements just before scrolling begins. When leaving away the CSS for the 'ftscroller_scrolling' class everything runs very smoothly - however at the cost of losing some styles (user-select:none and cursor:scroll-all).

So I wrote this patch which adds an option to not trigger these styles on the container itself, but just on the scrollbar. I am not sure this is the best solution - I think it would be better to make the CSS better customizable, but this would need changes to the embedding of the CSS. I'm open to help here after discussing the general direction.