gdepourtales / ng-cells

AngularJS Table directive that draws a table of data with different features
http://gdepourtales.github.io/ng-cells/
Other
77 stars 17 forks source link

Scrolling is not smooth #20

Closed MaestroJurko closed 10 years ago

MaestroJurko commented 10 years ago

It is doing jumps, do I have to add some sort of property to enable smooth scrolling like here http://gdepourtales.github.io/ng-cells/?

Can you please give me some update soon, this is the only thing that is bugging be :(.

No one of examples is scrolling smooth :(.

MaestroJurko commented 10 years ago

?? Can anyone please give some information about scrolling? I was checking the example on the page, and I didn't find any other library or different configuration for the directive, so what am I missing??

shammai commented 10 years ago

The directive redraws the table during the vertical scroll. Since there isn't an overflow you can't have smooth scrolling. On Oct 20, 2014 10:23 AM, "mato75" notifications@github.com wrote:

?? Can anyone please give some information about scrolling? I was checking the example on the page, and I didn't find any other library or different configuration for the directive, so what am I missing??

— Reply to this email directly or view it on GitHub https://github.com/gdepourtales/ng-cells/issues/20#issuecomment-59692465 .

MaestroJurko commented 10 years ago

Can you please provide an example of what you mean, just a short code snippet, because I don't totally understand what you mean.

THX

kayhadrin commented 10 years ago

What @shammai means is that the ng-cells plugin does not actually scroll the table contents like you normally do in plain HTML. When you use your mouse to scroll the table, this plugin will actually replace the values in each table cell to make it appear to scroll - but in effect, the table and its cells have not "moved" at all.

Although that's good for pure js performance, it does not look smooth indeed. It's one drawback for quite a lot of other advantages if you ask me.

On 22 October 2014 01:20, mato75 notifications@github.com wrote:

Can you please provide an example of what you mean, just a short code snippet, because I don't totally understand what you mean.

THX

— Reply to this email directly or view it on GitHub https://github.com/gdepourtales/ng-cells/issues/20#issuecomment-59934597 .

MaestroJurko commented 10 years ago

But in the example that were shown on this website http://gdepourtales.github.io/ng-cells/, the scrolling is smooth? What is the difference?

I know it is replacing the content, but in the examples/tests, the scrolling is really bad - the content that is replaces is really slow, but on the website, it looks really good.

BAD: http://screencast.com/t/1QwNVNfv

GOOD: http://screencast.com/t/hILmBvfAwmi

kayhadrin commented 10 years ago

Ok, that demo page works exactly the way it's meant to be - although it's very fast because it's... a simple use case.

Now, I think the problem is to clarify what you meant by "jump"? By comparing your own ng-cells usage with the one on that demo page, how slow is it on a scale from 1-10? How many rows/columns are you using?

Beside, it'd be good to have an example of your problem on a dev demo site like jsbin, plunkr, codepen, etc...

On 24 October 2014 18:41, mato75 notifications@github.com wrote:

But in the example that were shown on this website http://gdepourtales.github.io/ng-cells/, the scrolling is smooth? What is the difference?

— Reply to this email directly or view it on GitHub https://github.com/gdepourtales/ng-cells/issues/20#issuecomment-60354501 .

MaestroJurko commented 10 years ago

The slow version, that is a minimal.html, that is located at test/minimal.html. Any suggestions, why is it slow?

If you don't have this issue, could you paste a working example, thx.

MaestroJurko commented 10 years ago

Any update??

kayhadrin commented 10 years ago

Hi @mato75,

I just saw your screencast - which I didn't notice when I replied to you by email last week.

The reason for the big scrolling difference between the official site and the code is... because the official site does not use the latest version of the code.

A few months ago, I added a feature to avoid scrolling for every little tick of mouse scroll because it is expensive (remember, with Angular, all scope html bindings will be recalculated at each digest cycle - here, that's every time the user scrolls).

So now, the code is designed to wait for the end of the vertical scroll + a few dozen ms before redrawing the table contents. That's why you get this effect.

MaestroJurko commented 10 years ago

Still not working with older (0.3.3) version.

http://jsfiddle.net/mato75/ztLhpf2g/11/ - ng-cells 0.3.3 - this version of library is used in the online examples

http://jsfiddle.net/mato75/ztLhpf2g/10/ - ng-cells latest

MaestroJurko commented 10 years ago

Any ideas why the /11/ is not scrolling smoothly?

kayhadrin commented 10 years ago

I've done a quick check and it's because the file at https://github.com/gdepourtales/ng-cells/blob/master/dist/0.3.3/ng-cells-0.3.3.min.js is incorrect - in the sense that it's not the true 0.3.3 version of the code (probably a later version instead).

To refer to the 0.3.3 code, you should refer to the git tag instead: https://github.com/gdepourtales/ng-cells/blob/0.3.3/dist/ng-cells-0.3.3.js

MaestroJurko commented 10 years ago

thx man, that is awesome.

http://jsfiddle.net/mato75/ztLhpf2g/12/ - it works :+1:

You said: A few months ago, I added a feature to avoid scrolling for every little tick of mouse scroll because it is expensive (remember, with Angular, all scope html bindings will be recalculated at each digest cycle - here, that's every time the user scrolls).

So now, the code is designed to wait for the end of the vertical scroll + a few dozen ms before redrawing the table contents.

How much more expensive on performance is when using the old version? And I think, there should be a property of some sort, that if true/false use the fast scrolling/slower scrolling.

gdepourtales commented 10 years ago

Hi all

Even if this issue is closed, I just wanted to let you know that v0.3.8 contains two options to control the behaviour of the scrollbars. Now if you set both 'scroll-delay' and 'wheel-scroll-delay' attributes to 0, you will get a smooth scrolling. See https://github.com/gdepourtales/ng-cells/blob/master/test/fast-scroll.html example

Cheers