DominikSerafin/vuebar

withScrollingClasses and performance

edenteam opened this issue · 2 comments

edenteam commented

We have perfomance problems with vuebar. When withScrollingClasses is enabled, phantom classes cause delays during scrolling.
http://g.recordit.co/drPqYpR7Y7.gif
But if we disable this option, scrolling stay more fast and lightful.

vuebar/vuebar.js

Line 364 in 2cb8d6f

updateDragger(el, {withScrollingClasses: true});

Can i disable this option without editing npm package?

DominikSerafin commented

Hey @edenteam ,

Thanks for opening up issue. Unfortunately it's not possible to disable this behavior in current version of Vuebar.

But, performance of Vuebar is really important to me. So I'll take some more time soon and I'll investigate it. And maybe I'll add this option in Vuebar 2.0 - or I'll fix the performance root cause.

Meanwhile, as a workaround, I suggest that you force GPU rendering on the scroll container, e.g. with backface-visibility: hidden CSS property. I've had good results this way with improving scroll performance in elements with lots of children.

DominikSerafin commented

@edenteam also, if you could provide me minimal reproduction related to this issue, this would help me hugely.

Here are good starting points:
http://jsfiddle.net/u94ns8jc/1/
https://www.webpackbin.com/bins/-Kyoqtm8CbjpkYegi7mF