Performance issue with KendoGrid in IE11

[Iurii]

In IE11 Kendo Grid Render of average amount of data could take up to 10s or even more. This issue is a blocker for our project.

There is a demo with simple table with 500 rows and 24 columns, please see attachment kendo-grid-demo.zip

Please comment upon this ticket. It would be great to know when this ticket will be fixed.

Br, 

Iurii

[Nikolay]

Hi Iurii,

You can use the Grid virtualization functionality to resolve the problem. Here is a demo - https://www.telerik.com/kendo-react-ui/components/grid/columns/column-virtualization/.

Regards,
Nikolay
Progress Telerik

[Iurii]

Hi Nikolay, 

We cannot use virtualization for two reason:
1. We have tried it on IE11 and it still performs slowly. 
2. We have an expandable rows which could be different high and it has not supported by virtualization functionality yet. Also, I have posted a ticket about virtualization some time ago - https://www.telerik.com/forums/grid-with-virtualscroll-doesn't-work-with-grouping-feature-properly.

[Stefan]

Hello, Iurii,

What I can suggest in this case is the following:

1) Use the columnVirtualization, not the row virtualization:

https://www.telerik.com/kendo-react-ui/components/grid/api/GridProps/#toc-columnVirtualization

If there will be custom cells, add the colSpan prop to the td that is coming from the props(it is required for the column virtualization):

const CustomCell = (tdElement, cellProps) => {
    return <td colSpan={cellProps.colSpan}>{cellProps.dataItem.city}</td>;
};

2) Instead of using row virtualization, use paging with maximum of 60 - 100 items per page.

 

This combination will ensure that the Grid will load faster and will not cause issues with detail rows.

Also, when testing a React application for performance, please make sure to test the build version as React is times faster when built for production.

npm run build 

serve -s build

 

Regards,
Stefan
Progress Telerik