DataGrid self-Reference hierarchy slow expand with large amount of data

Radzen.Blazor Components
1

I have a datagrid with a large amount of items (9351). When I expand the parent item it takes 13 seconds to load 3 child items. Then I tested with a smaller number of items (212) and it loaded almost instantly.
To make sure it wasn't something to do with how I was loading the data, I set a breakpoint within LoadChildData where args.Data is set - it hit that breakpoint almost instantly.
Is there anything I could do on my side to improve the child load time?

2

You might want to use paging instead rendering all items.

3

Apologies, I should've given more info in a original post. I am using paging. I've added the relevant code below.

<RadzenDataGrid @ref="dataGrid" GridLines="@DataGridGridLines.Both" AllowAlternatingRows="true" AllowColumnResize="true" AllowSorting="true"
                AllowPaging="true" PagerHorizontalAlign="HorizontalAlign.Center" PageSize="24" ShowPagingSummary="true" PageSizeOptions="@pageSizeOptions" LoadChildData="@LoadChildData" ExpandMode="DataGridExpandMode.Multiple"
                @bind-Value="@selectedItems" Data="@Items" TItem="Customer" IsLoading=@DataLoading Sort="@ShowLoading" Page="@ShowLoading" ColumnWidth="120px" RowRender="@RowRender" RowClick="@(e => RowClicked(e.Data))">
 <Columns>
...
    </Columns>
</RadzenDataGrid>
...
private void RowRender(RowRenderEventArgs<Customer> args)
{
    args.Expandable = args.Data.IsCustLevel;
}

private async Task LoadChildData(DataGridLoadChildDataEventArgs<Customer> args)
{
    args.Data = await LoadAccounts(args.Item.Number);
}

private async Task<IEnumerable<Customer>> LoadAccounts(string custNum)
{
    CustomerSearch acctSearch = new() { CustNum = custNum, Product = searchForm.Product };
    HttpResponseMessage response = await Http.PostAsJsonAsync("api/Customer/GetSearchAccounts", acctSearch);
    return await response.Content.ReadFromJsonAsync<IEnumerable<Customer>>();
}
4

In this case the slowness comes from the http requests. You can verify this using your browser network tab - how many requests are executed and what time it takes for each of them.

5

That is what I originally assumed, but I added a breakpoint and the Http request returns results almost instantly.

6

Can you post the requests from your browser network tab?

7

Capture
Above is an example of two different requests. Once the results from the request is returned, it has been taking several seconds afterwards to load the child items.
I've noticed that when the child items are loaded, parent items are shifted to other pages based on the PageSize. Could this be why the datagrid takes so long to load child items with a large number of parent items?

8

I don't think so. You can attach Radzen.Blazor.csproj to your application to debug our code also.

9

Thanks, I'll do that.

10

After debugging, I've found that the line where the breakpoint is below (line 1735) is what is taking so long.

Capture
Capture664×516 44.5 KB

I'm still confused why, though, when the initial load of just the parent items does not take nearly that long.

1 Like
11

Any follow up on this? Having the same problem

12

I encountered the same problem (I have about 800 elements and my tree structure is completely in memory).

So again any news?