Grid loads items in smaller portions than page size, when scroll from bottom to top.

[Yuliya]

Hello, guys,

The following problem exists:
When you move to the bottom of the grid, and start scrolling up, items are loaded in small portions (3, 5, 20 items), doesn't matter what size of virtual page is set.


Regards,
Yuliya

[Yoan]

Hello Yuliya,

This is indeed strange. I've tried to reproduce the problem you report but to no avail. You can check our online demo for a reference. Please let me know in case I am missing something.


Regards,
Yoan
Telerik

 

 

[Yuliya]

Hi, Yoan,

Online demo won't help, because it's not something that the user can notice, except the performance.

Here is the code, that reproduces the problem.

View:

<Window x:Class="RadGridView_Virtualization.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
        xmlns:local="clr-namespace:RadGridView_Virtualization"
        Title="MainWindow" Height="350" Width="525">
    <Window.Resources>
        <local:MyViewModel x:Key="MyViewModel" />
    </Window.Resources>

    <Grid DataContext="{StaticResource MyViewModel}">
        <telerik:RadGridView x:Name="gridAccessList"
                              Height="240"
                              Width="370"
                              RowIndicatorVisibility="Collapsed"
                              AutoGenerateColumns="False"
                              ItemsSource="{Binding Path=Items}">

            <telerik:RadGridView.Columns>
                <telerik:GridViewDataColumn DataMemberBinding="{Binding Id}"
                                    Width="*"
                                    EditTriggers="None" />
            </telerik:RadGridView.Columns>
        </telerik:RadGridView>
    </Grid>
</Window>

ViewModel:

public class MyViewModel : INotifyPropertyChanged
    {
        public event PropertyChangedEventHandler PropertyChanged;

        public MyViewModel()
        {
            Items = new VirtualQueryableCollectionView<DummyData>
              {
                VirtualItemCount = 1000, LoadSize = this.LoadSize
              };

            Items.ItemsLoading += (sender, args) =>
            {
                this.Source = new List<DummyData>();
                for (int i = 0; i < args.ItemCount; i++)
                {
                    this.Source.Add(new DummyData { Id = args.StartIndex + i });
                }

                Items.Load(args.StartIndex, this.Source);
            };
        }

        private List<DummyData> source;
        public List<DummyData> Source
        {
            get { return this.source; }
            set { this.source = value; }
        }

        private int loadSize = 50;
        public int LoadSize
        {
            get { return loadSize; }
            set { loadSize = value; }
        }

        public VirtualQueryableCollectionView<DummyData> Items { get; private set; }

        public class DummyData
        {
            public int Id { get; set; }
        }
    }

Try to put breakpoint inside ItemsLoading handler, while scrolling from bottom to top, and see values of args.ItemCount: it's small (2,3,5), although size of page is set to 50.

Regards,
Yuliya

[Yoan]

Hello Yuliya,

Thank you for clarifying.

I was able to reproduce this behaviour on my end. As it turns out this would be an expected behaviour. Basically, the ItemsLoading event will be called and the empty items in the collection will be replaced with the new items while scrolling down. On the other hand, when you start scrolling to the Top, the items are already loaded so you will get the described behaviour. 

Regards,
Yoan
Telerik

 

 

[Yuliya]

Hi, Yoan,

How can this be an expected behavior? If data is already loaded - it shouldn't be loaded again. Instead, the grid starts to load items in very small portions. This is a bug, and it influences performance of the grid.

This issue can be reproduced in other scenarios, for example, if user scrolls to the bottom of the grid, and then tries to refresh the grid. I can send you a sample, that shows described scenario.

Regards,
Yuliya

[Yoan]

Hi Yuliya,

As it turns out when you scroll upwards there will be less items needed to be loaded, for example - only 1. That is why the LoadSize will be the number of Items the GridView has requested. VirtualQueryableCollectionView does not clear old items already presented into view. I am afraid that this behavior is by design in order to smooth scrolling performance. 

Regards,
Yoan
Telerik

 

 

[Yuliya]

Hi, Yoan,

Ok, I guess, I understand why the grid is designed to act like this: because when you scroll from bottom to top - the grid doesn't know how many of the previous items are already loaded, so it only requests exact number of items to be displayed. But we're talking about grid that supports virtualization, so I don't think it should make sense if the user scrolls from top to bottom or the other way around - behavior of the grid shouldn't change. So, the best way to solve this problem would be to check if the previous page is already loaded, and if it's not - request the entire page, instead of just few records.

If this problem is not fixed - I face troubles with my custom selection solution. I've added a behavior, that supports selection functionality together with virtualization. For example, when user presses Shift + mouse click - all the selected data are retrieved and loaded into the grid. When user clicks at the bottom and then Shift + click on top - a lot of data might be selected. Because of described issue, huge amount of data will be loaded in very small portions, which causes performance problems and confuses the user: the same selection from top to bottom is done much faster.

Besides, I've noticed, that scrolling from bottom to top is not the only scenario, when issue of "requesting data in small portions" is reproduced. You can do the following thing: select some row on top of grid, then scroll a little bit till the next virtual page, select other item, scroll till yet another virtual page and try to refresh the grid. If you put breakpoint into ItemsLoading handler - you'll see that data is loaded in small portions. I've attached the screenshot, where this issue is demonstrated. Refresh method on screenshot handles Click event of "Reload" button.

[Dimitrina]

Hi,

Indeed, your suggestion seems reasonable from the perspective of a client. As it turns out though, it is not the same as it comes to the implementation. The virtual collection is designed like so in order to have smooth scrolling performance and ensure all requested items are actually loaded.

I understand this performance problem and indeed it is caused because of loading single items. I consulted the case with my colleagues and I am afraid we cannot change the design.

Furthermore, I should mention the Extended selection with VirtualQueryableCollectionView is only recommended when the selected items are in the View area. It is not possible to actually select items outside it as the items to be eventually displayed are still not presented. This is the case until the user scrolls to a particular position so that the items to be displayed into view are actually loaded. 
You can find a feedback item on the matter on our Feedback portal here.

Regards,
Didie
Telerik