View Full Version : Infinite Scroll Grid - scroll problem

20 Aug 2013, 7:09 AM

We have a grid with around 30000 rows with store buffered.
Every page it takes like 2-3 sec to loads and 1-2 to render (we have a lot of columns around 100 with special render functions)
I cannot reproduce on our example because of the fast loading of every page, but I think you have a problem in the bufferrender plugin.

Steps to reproduce (on a big grid with a lot of columns):
1. load the first page.
2. Drag the scroll on the middle of the view ( don't let the mouse )
3. let the grid begin the load the data for that page
4. after the grid begin load the data, scroll on another page.
5. after the grid begin load the data, scroll on another page.
6. after the grid begin load the data, scroll on another page.
7. after the first page is loading the grid now has no mask, but the grid is still loading

On 4.1.3 you have a component named PagingScroller, that in onViewRefresh function "took" care of this problem ( moving the scroll on the last page that user loads even if there are 100 pages that are loading because user did not let go of the scroollbar on every of this pages). On 4.2.1 that should be take care by the same function in that new plugin that you introduce ( BufferedRender ).
In my case that will introduce a lot of problems (a grid that loads data but have no mask) ( example ADD row feature )
Sory that I can't give you an example (with code).... but if you can make your example to load slow a page ( like a normal application ).... I can show you that problem.

Best Regards

20 Aug 2013, 8:24 AM
I strongly recommend to not stick with 4.1.3 but migrate to the latest version. A lot has changed in a good way, especially for the grid.

I recommend to never ever create a buffered grid with 100+ columns and custom renderers.

a) Custom renderers cost a lot of performance, be careful with it.
b) Hidden columns get rendered as well also executing renderers
c) it is not a good user experience to show that many columns

-> think about creating a subset of the column model which you can dynamically change using gridpanel.reconfigure(). test your example with 10 or max 20 columns and compare the performance.

d) You can specify how many rows to load and how big the leading and trailing buffer zones are. Keep them short.

20 Aug 2013, 10:53 AM
Thanks for the response.

I totally agree with those best practices
1. That will not replace the fact that is an bug in the bufferrender plugin.
The last solution that I can think of is that I have to modified that function (onviewrefresh) like it was on paging scroller (4.1.3) or make a function on viewrefresh event.
2. And for migration.....there are a lot of new things in 4.2.1 but the infinite scroll grid ( this is my big problem ) has some annoying issues ( this one and the reload function on the store (it is not working) )
...and finally....on the documentation could you tell if that you have filter to filter all the function for a component newer then a version....I mean in 4.1.3 we create some new function....and I saw that you introduce them in the newest version.....and I have to replace those function with the ones you provide in the newest framework. It will be very useful so we can filter so see all the function and properties that was introduce in a particular version ( or in the one we are looking).