What strategies can be implemented to optimize the performance of a dropdown tree in Syncfusion forms, particularly when dealing with large dataset

[GOKALA SHARMA]

What strategies can be implemented to optimize the performance of a dropdown tree in Syncfusion forms, particularly when dealing with relatively large datasets (e.g., more than 20K entries), which currently load slowly and display as a list?

We are using the dropdown in the data grid component of the syncfusion as

<SfGrid @ref="grid" DataSource="@data" AllowPaging="true" AllowFiltering="true" Toolbar="@(new List<string>() { "Edit", "Update", "Cancel" })">

    <GridFilterSettings Type="Syncfusion.Blazor.Grids.FilterType.Excel"></GridFilterSettings>

    <GridEvents OnActionBegin="OnActionBegin" OnActionComplete="OnComplete" OnCellSave="OnCellSave" TValue="ExpandoObject"></GridEvents>

    <GridEditSettings AllowEditing="true" AllowDeleting="false" AllowAdding="false" Mode="@EditMode.Normal"></GridEditSettings>

    <GridColumns>

        @foreach (var column in columns)

        {

            @if (column.Equals("asset_name"))

            {

                <GridColumn Field="@column" HeaderText="@column" AllowEditing="true" EditType="EditType.DropDownEdit" Visible="true">

                    <EditTemplate>

                        <Syncfusion.Blazor.Navigations.SfDropDownTree TValue="string" TItem="treejson" Placeholder="Select an Asset" Width="500px" @bind-Value="@SelectedNode" AllowFiltering="true" FilterType="Syncfusion.Blazor.DropDowns.FilterType.Contains" LoadOnDemand="true">

                            <Syncfusion.Blazor.Navigations.DropDownTreeField TItem="treejson" ID="id" DataSource="@Assets" Text="name" Child="children" Expanded="expanded"></Syncfusion.Blazor.Navigations.DropDownTreeField>

                        </Syncfusion.Blazor.Navigations.SfDropDownTree>

                </EditTemplate>

                </GridColumn>

            }@if (column.Equals("asset_name") || column.Contains("id"))

            {

                <GridColumn Field="@column" HeaderText="@column" AllowEditing="false" EditType="EditType.DropDownEdit" Visible="false">

                </GridColumn>

            }

            else

            {

                <GridColumn Field="@column" HeaderText="@column" AllowEditing="true" Visible="true">

                </GridColumn>

            }

        }

    </GridColumns>

[Jafar Ali Shahulhameed]

Hi Gokala,

We were able to replicate the reported issue in the Syncfusion Dropdown Tree component and we considered this as bug on our end. The fix for this issue will be included in the upcoming volume 1 release.

You can track the status of the fix through the following link.

Feedback:  https://www.syncfusion.com/feedback/51417/performance-issue-in-dropdowntree-component-with-large-set-of-data

Regards,

Jafar