This is a migrated thread and some comments may be shown as answers.

Limitations of Virtual Scrolling

8 Answers 530 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Kaan
Top achievements
Rank 1
Kaan asked on 22 Nov 2016, 09:20 AM

Hello!

I have some questions regarding the limitations of virtual scrolling and I am referring to your documentation: http://docs.telerik.com/kendo-ui/controls/data-management/grid/appearance#virtual-scrolling

1) "Virtual scrolling relies on a fake scrollbar. Its size is not determined
by the browser, but is calculated based on the average row height of
the data that is already loaded. As a result, variable row heights may
cause unexpected behavior, such as inability to scroll to the last rows
on the last page." and "Virtual scrolling relies on calculating the average row height based on
already loaded data. Having a large variance of row heights or an
unknown number of rows that are not bound to data (such as group
headers) might cause unexpected behavior:":
To prevent this, I am calling resize(true) on the grid widget every time the data is bound (dataBound event handler). It seems like this works, but am I missing something?

2) "Virtual scrolling is not compatible with grouping, hierarchy, and editing":
I am using a grid with batch editing mode, and it seems to work. Could you please share some details about what's not compatible with editing exactly?
And what are the known incompatibilities with grouping? I have found out, that the grid does not remember collapsed groups when the page size is crossed while scrolling and the next page of data items is bound to the grid, so the collapsed groups get automatically expanded again. Also, if a group is being collapsed, the space of the previous shown data items remains blank, instead of the next group being shown immediately below.

Thank you in advance for providing information about the grid virtual scrolling limitations of the current Kendo UI release version.

Best regards,

Kaan

8 Answers, 1 is accepted

Sort by
0
Kaan
Top achievements
Rank 1
answered on 22 Nov 2016, 09:22 AM
ad 1) http://docs.telerik.com/kendo-ui/api/javascript/kendo#methods-resize
0
T. Tsonev
Telerik team
answered on 24 Nov 2016, 07:29 AM
Hi,

Thank you for reading the documentation

1) Yes, calling resize() is what we recommend. This is the best we can offer without a way to know all row heights in advance.
2) Inline editors will be reset every time the row moves out of the viewport. If you scroll back the row will not be in edit mode anymore.
Popup editing is affected too, as the viewport will be redrawn on scroll.
For grouping - that's about it. The most sever limitation is that collapsing the group will not pull records from below.

I hope this makes sense.

Regards,
T. Tsonev
Telerik by Progress
Kendo UI is ready for Visual Studio 2017 RC! Learn more.
0
Kaan
Top achievements
Rank 1
answered on 28 Nov 2016, 01:53 PM

Hi,

Thank you for your clarifications.

Inline editors behave very similar in paging mode. They will also be reset when browsing to another page. So at least this behavior is not worse in virtual scrolling mode.

However, the grouping functionality is very important for our business application. That collapsing a group will not pull records from below is not very beautiful, but we can live with that. The bigger problem is when having groups with large data sets. When you collapse such a group and you want to scroll down to the next group, all the collapsed groups will be expanded as soon as the next virtual page is hit by the user. This breaks the grid usability for the user.

Do you think this could be solved by incorporating your example on how to "Persist Collapsed State of Grouped Records" (http://docs.telerik.com/kendo-ui/controls/data-management/grid/how-to/state/persist-grouped-grid-collapsed-details-state#persist-collapsed-state-of-grouped-records)? Do you have any experience with that? Are there any known issues or downsides of adding "Persist Collapsed State of Grouped Records" functionality to virtual scrolling? If this could be solved, virtual scrolling would be a wonderful solution for our business application.

 

Best regards,

Kaan

0
T. Tsonev
Telerik team
answered on 30 Nov 2016, 09:26 AM
Hi,

Agreed on inline editors. Still, navigating to a different page is a more conscious action than scrolling a single row up or down.

The solution for persisting the collapsed state can work, at least in theory, in a virtualized Grid.
We've prepared a proof of concept, but it's not without its flaws. You'll notice a flicker while the groups are collapsed.

Regards,
T. Tsonev
Telerik by Progress
Kendo UI is ready for Visual Studio 2017 RC! Learn more.
0
Surya
Top achievements
Rank 1
answered on 22 May 2017, 02:25 PM

Hi,

Does Virtual scroll works with detail templates?

Regards,

Surya

 

0
Tsvetina
Telerik team
answered on 24 May 2017, 09:54 AM
Hi Surya,

Unfortunately not, virtual scrolling is not compatible with hierarchical Grid set up. All limitations of virtual scrolling are listed here:
Limitations of Virtual Scrolling

Regards,
Tsvetina
Telerik by Progress
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Piotr
Top achievements
Rank 1
answered on 05 Sep 2017, 11:11 AM

Hi,

Is there any chance  virtual scrolling will work with grouping in future releases?

Regarts 

Peter

0
Tsvetina
Telerik team
answered on 06 Sep 2017, 04:13 PM
Hello Peter,

There aren't plans as of current to introduce grouping support with virtual scrolling. As explained in the docs,virtual scrolling relies on calculating the average row height based on already loaded data. Having a large variance of row heights or an unknown number of rows that are not bound to data (such as group headers) prevents the correct calculation of the scroll height.
A limitation of virtual scrolling, which will soon be resolved, is data editing. This is already in development.

Regards,
Tsvetina
Progress Telerik
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Tags
Grid
Asked by
Kaan
Top achievements
Rank 1
Answers by
Kaan
Top achievements
Rank 1
T. Tsonev
Telerik team
Surya
Top achievements
Rank 1
Tsvetina
Telerik team
Piotr
Top achievements
Rank 1
Share this question
or