Table Component render to much times

[JustGentle]

The same amount (80 columns, 20 rows) of data, antTable and other Table components comparison:

• switch row
  • Render times of other components = 160 times
  • Render times of ant component = 5200 times
• Click the empty button
  • Render times of other components = 1600 times
  • Render times of ant component = 4960 times
• Entering the page for the first time
  • Render times of other components = 1600 times
  • Render times of ant component =400+400+1440+4240+4400=10880 times

@page "/anttable"
<div class="d-flex flex-column overflow-hidden" style="width: 90vw;">
    <h3>AntTable</h3>
    <div class="flex-fill">
        <button @onclick="@(_=>{})"></button>
        <Table DataSource="@DataList" TItem="Dictionary<string, string>" Bordered=@true Size="TableSize.Small" SelectedRows="@Selection"
            ScrollX=@ScorllX ScrollY="500" ScrollBarWidth="5" [email protected] EnableVirtualization=@true OnRowClick=@OnRowClick>
            <TitleTemplate>
                <AntDesign.InputNumber TValue="int" @bind-Value="@AddTimes"></AntDesign.InputNumber> <Button OnClick=@AddColumn>AddColumn</Button><Button OnClick=@AddRow>AddRow</Button>
            </TitleTemplate>
            <ChildContent>
            @{
                <Selection Fixed="left"></Selection>
                var index = 0;
                foreach (var column in Columns)
                {
                    Console.WriteLine("test");
                    if(index < FixedColumnCount)
                    {
                        <Column TData="string" DataIndex="@($"['{column}']")" Fixed="left"></Column>
                    }
                    else
                    {
                        <Column TData="string" DataIndex="@($"['{column}']")"></Column>
                    }
                    index++;
                }
                <ActionColumn Fixed="right">
                @{
                    //Console.WriteLine("Action");
                    <Button>action</Button>
                }
                </ActionColumn>
            }
            </ChildContent>
        </Table>
    </div>
</div>
@code {
    private int AddTimes = 1;
    public int FixedColumnCount { get; set; } = 2;
    public string ScorllX { get; set; } = "0";
    public List<Dictionary<string, string>> DataList { get; set; } = new();
    public List<string> Columns { get; set; } = new();
    public IEnumerable<Dictionary<string, string>> Selection;
    protected override async Task OnInitializedAsync()
    {
        await base.OnInitializedAsync();

        for(var i = 0; i < 80; i++)
        {
            AddColumn();
        }
        for (var i = 0; i < 20; i++)
        {
            AddRow();
        }
    }
    private void AddColumn()
    {
        for (var t = 0; t < AddTimes; t++)
        {
            var column = $"c{Columns.Count}";
            Columns.Add(column);
            for (var j = 0; j < DataList.Count; j++)
            {
                var item = DataList[j];
                item[column] = $"r{j}-{column}";
            }
        }
        ScorllX = (80 * Columns.Count).ToString();
    }
    private void AddRow()
    {
        for (var t = 0; t < AddTimes; t++)
        {
            var item = new Dictionary<string, string>();
            for (var i = 0; i < Columns.Count; i++)
            {
                var column = $"c{i}";
                item[column] = $"r{DataList.Count}-{column}";
            }
            DataList.Add(item);
        }
    }
    protected override bool ShouldRender()
    {
        Console.WriteLine("ShouldRender");
        return base.ShouldRender();
    }
    private void OnRowClick(AntDesign.TableModels.RowData<Dictionary<string, string>> rowData)
    {
        //rowData.Selected = !rowData.Selected;
        //Selection = new List<Dictionary<string, string>> { rowData.Data };
    }
}