Jqgrid treegrid 在 IE8 中的性能问题

Question

我正在使用 jqgrid treegrid 在 expand 事件上远程加载数据。它正在快速检索数据，但在客户端加载和折叠节点需要时间，它在 IE8 上给出停止脚本错误。在 FF 和 Chrome 上，它确实需要时间，但不会出现任何脚本错误。我只有 480 条记录要显示，但 treegrid 显示出巨大的性能缺陷。崩溃的 FEB-2012 节点上的 IE8 错误...

Answer 1

我测试了你的演示，我有一个技巧可以显着提高性能。原因是the line内部 expandRow :

$("#"+id,$t.grid.bDiv).css("display","");

和 another line内部 collapseRow :

$("#"+id,$t.grid.bDiv).css("display","none");

线路使用 $t.grid.bDiv作为 jQuery 上下文参数。因此，来自 $t.grid.bDiv 的数据不使用现有的 id 索引来搜索填充。如果网格没有 id 重复项(这将是数据中的一个错误)，可以删除 $t.grid.bDiv范围

The demo与您的原始演示相同，但​​我使用了将上述行替换为的函数的固定代码

$("#"+$.jgrid.jqID(id)).css("display","");

和

$("#"+$.jgrid.jqID(id)).css("display","none");

我用的是原来的jqGrid 4.1.1 jquery.jqGrid.min.js ，但只覆盖了代码 expandRow和 collapseRow功能与

$.jgrid.extend({
    expandRow: function (record){
        this.each(function(){
            var $t = this;
            if(!$t.grid || !$t.p.treeGrid) {return;}
            var childern = $($t).jqGrid("getNodeChildren",record),
            //if ($($t).jqGrid("isVisibleNode",record)) {
            expanded = $t.p.treeReader.expanded_field;
            $(childern).each(function(i){
                var id  = $.jgrid.getAccessor(this,$t.p.localReader.id);
                //$("#"+id,$t.grid.bDiv).css("display","");
                $("#"+$.jgrid.jqID(id)).css("display","");
                if(this[expanded]) {
                    $($t).jqGrid("expandRow",this);
                }
            });
            //}
        });
    },
    collapseRow : function (record) {
        this.each(function(){
            var $t = this;
            if(!$t.grid || !$t.p.treeGrid) {return;}
            var childern = $($t).jqGrid("getNodeChildren",record),
            expanded = $t.p.treeReader.expanded_field;
            $(childern).each(function(i){
                var id  = $.jgrid.getAccessor(this,$t.p.localReader.id);
                //$("#"+id,$t.grid.bDiv).css("display","none");
                $("#"+$.jgrid.jqID(id)).css("display","none");
                if(this[expanded]){
                    $($t).jqGrid("collapseRow",this);
                }
            });
        });
    }
});

我认为可以进一步提高代码的性能，但至少简单的更改可以显着提高具有许多项的树节点的折叠或展开的性能。

更新:我刚刚发帖 the pull request在jqGrid的主要代码中解决了上述问题。我决定使用 $($t.rows.namedItem(id))而不是上面描述的 $("#"+$.jgrid.jqID(id))。我没有准确测量性能，而是使用 namedItem应该是最接近原始 jqGrid 代码的，我希望它作为 jQuery 的 id 选择器可以更快地工作。

更新 2:修复现在位于 github 上 jqGrid 的主要代码中(参见 here)