Performance in MAUI DataGrid (SfDataGrid)

17 Sep 20244 minutes to read

LoadUIView

By default, the SfDataGrid loads a UIElement into the DataGridCell to display the cell content. The DataGridColumn.LoadUIView property determines whether to load a UIElement or to draw the cell content directly within the DataGridCell to improve scrolling performance. This is applicable for the all platforms except Windows.

If LoadUIView is set to false, the cell content will be drawn directly in the grid cell to enhance performance. However, when LoadUIView is set to true, the cell content will be displayed through the UIElement.

The default value of this property is true. If you want to improve loading and scrolling performance, you can simply set the LoadUIView property to false.

<sfgrid:SfDataGrid ItemsSource="{Binding OrdersInfo}">
    <sfgrid:SfDataGrid.Columns>
        <sfgrid:DataGridNumericColumn MappingName="OrderID" HeaderText="Order ID" LoadUIView="False"/>
        <sfgrid:DataGridTextColumn MappingName="CustomerID" HeaderText="Customer ID" LoadUIView="False"/>
    </sfgrid:SfDataGrid.Columns>
</sfgrid:SfDataGrid>

NOTE

Download demo application from GitHub.

Limitations

Data virtualization

DataGrid provides support to handle the large amount of data through built-in virtualization feature. With Data virtualization, the record entries will be created in the runtime only upon scrolling to the vertical end which increases the performance of grid loading time.

To set SfDataGrid.EnableDataVirtualization property to true, follow the code example:

<syncfusion:SfDataGrid x:Name="dataGrid"
                       ItemsSource="{Binding EmployeeDetails}"
                       EnableDataVirtualization="True"/>
datagrid.EnableDataVirtualization = true;

Incremental loading

The DataGrid supports loading data incrementally using the ISupportIncrementalLoading interface. This interface includes the LoadMoreItemsAsync method, which helps to load data incrementally. The LoadMoreItemsAsync method is called on-demand while scrolling, based on the HasMoreItems property.

If HasMoreItems is false, SfDataGrid stops calling LoadMoreItemsAsync. SfDataGrid includes IncrementalList, which is derived from ISupportIncrementalLoading. You can use IncrementalList or create a collection derived from ISupportIncrementalLoading and bind it to SfDataGrid.ItemsSource.

Additionally, the SfDataGrid.DataFetchSize property defines the count argument in the LoadMoreItemsAsync method, which determines the amount of data to be loaded into the items source when the user reaches the end of the SfDataGrid.

In the code below, IncrementalList is initialized by passing an Action to its constructor for loading items incrementally.

<syncfusion:SfDataGrid DataFetchSize="20"
                       ItemsSource="{Binding IncrementalItemsSource}" />
public class ViewModel
{
    public ViewModel()
    {
        IncrementalItemsSource = new IncrementalList<OrderInfo>(LoadMoreItems) { MaxItemsCount = 200 };
    }
    private IncrementalList<OrderInfo> _incrementalItemsSource;

    public IncrementalList<OrderInfo> IncrementalItemsSource
    {
         get { return _incrementalItemsSource; }
         set { _incrementalItemsSource = value; }
    }

    async void LoadMoreItems(uint count, int baseIndex)
    {
   
             var _orders = this.GenerateOrders();
             var list = GenerateOrders().Skip(baseIndex).Take(5).ToList();
             IncrementalItemsSource.LoadItems(list);
    }
}