如何从Infragistics Ignite-UI提高igGrid的性能？

Question

我将从描述我的情况开始。

1. 我使用分页。在最困难的情况下，我的网格有100行和120列。
2. 我使用的功能包括：排序，分组，行选择，列隐藏，列移动，远程和本地分页，列固定（冻结）。

我对这个要求没有影响 - 业务需要它，我不能改变它。问题是性能是不可接受的我必须改进它。其实我不知道如何实现它。

渲染网格的性能非常好，但渲染网格所需的时间绝对不可接受。

在chrome中，渲染网格需要大约40秒。在Internet Explorer（我必须支持）中，渲染网格持续约2分钟。这些时间是100行和120列，有4个固定列（我发现固定柱对性能有巨大影响 - 没有固定渲染过去19秒，4个固定列在铬中持续40秒）。在计算配置时，只需渲染网格就需要这些时间 - 换句话说，这是从执行带有ready configuration_object函数的igGrid（config_object）到渲染网格的时刻的时间。

我已经阅读了有关网格虚拟化的内容，但它有所帮助，因为我不能将列虚拟化与所需的功能结合使用。说实话，有了这些限制，网格和简单表与虚拟滚动之间有一点差别。附加行虚拟化有一点帮助，但这还不够，因为行数减少了使用网格的性能 - 滚动时滞后。

我的问题是：

• 如何才能提高性能，是否可以使用Igniete UI？
• 我能够通过100列，120列和我列出的应用功能完美优化的网格配置实现了多少次？
• 如何减少修复功能对性能的影响？
• 我还发现，如果页面上有100行，那么在行虚拟化中，DOM中会创建大约70行。也许有一种方法可以减少渲染速度？
• 也许实际上有一种方法可以显示网格，例如20行和20列，使网格可用并在以后渲染其余部分？

Answer 1

使用最新版本的IgniteUI for JavaScript - 版本18.2，使用指定的设置，我在测试初始加载性能时无法获得相同的结果。这是一个带有应用设置的jsFiddle，供您参考：

$("#grid").igGrid({...});

http://jsfiddle.net/ojpydtwm/

我观察到的渲染的初始时间如下：

• 在最初固定列的Chrome上 - 大约3.5秒
• 在没有最初固定列的Chrome上 - 大约2.5秒
• 在最初固定列的IE上 - 大约9.5秒
• 在没有最初固定列的IE上 - 大约6秒

Answer 2

更大的性能开销是由渲染的120列引起的。默认情况下，igGrid不是水平虚拟化的，即使您打开虚拟化，它也不能与您在需求中启用的某些功能兼容。你获得Chrome的时间仍然不是他们应该得到的，我的建议是在Infragistics的支持下解决这个问题。

与此同时，帮助中有this article，它提供了如何使用igGrid使性能达到最佳的指导。