IE8中的Jqgrid treegrid性能问题 [英] Jqgrid treegrid performance issues in IE8

问题描述

我正在使用jqgrid treegrid在扩展事件上远程加载数据.它正在快速检索数据，但是要花费一些时间在客户端上以及在折叠节点上加载，这会在IE8上产生停止脚本错误.在FF和Chrome上，确实需要时间，但不会出现任何脚本错误.我只有480条记录要显示，但是treegrid表现出巨大的性能缺陷.折叠FEB-2012节点时出现IE8错误...

I am using jqgrid treegrid to load the data remotely on expand event. It is retrieving the data fast but it is taking time to load on client side and also on collapsing the node, it is giving stop script error on IE8. On FF and Chrome, it does take time but works with out any script errors. I only have 480 records to display but treegrid shows huge performance drawback. IE8 error on collapsing FEB-2012 node...

推荐答案

我测试了您的演示，并且有一个技巧可以极大地提高性能.原因是该行位于 expandRow :

I tested your demo and I have one tip hot to improve the performance dramatically. The reason are the line inside of expandRow:

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

和另一行 collapseRow :

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

这些行使用$t.grid.bDiv作为jQuery上下文参数.因此，将搜索$t.grid.bDiv填充中的数据，而不使用现有的id索引.如果网格没有ID重复(这可能是数据中的错误)，则可以删除$t.grid.bDiv参数

The lines uses $t.grid.bDiv as the jQuery context parameter. It follows that the data from $t.grid.bDiv fill be searched without using the index existing for ids. In case of the grid has no id duplicates (which would be a bug in the data) one can remove the $t.grid.bDiv parameter

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

The demo is identical to your original demo, but I used the fixed code of the function where the above lines are replaced to

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

和

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

我使用了原始的jqGrid 4.1.1 jquery.jqGrid.min.js，但是仅用expandRow和collapseRow函数覆盖了代码

I used the original jqGrid 4.1.1 jquery.jqGrid.min.js, but overwrote the code only the expandRow and collapseRow function with

$.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);
                }
            });
        });
    }
});

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

I think that one can more improve performance of the code, but at least the simple change can improve dramatically the performance of collapsing or expanding of tree nodes having many items.

更新:我刚刚发布了拉动请求在jqGrid的主代码中解决了上述问题.我决定使用$($t.rows.namedItem(id))而不是上面的$(#" + $.jgrid.jqID(id)).我没有精确测量性能，但是

UPDATED: I posted just now the pull request which fix the described above problem in the main code of jqGrid. I decided to use $($t.rows.namedItem(id)) instead of described above $("#"+$.jgrid.jqID(id)). I didn't measure the performance exactly, but the usage of namedItem should be the most close to the original jqGrid code and I hope it works a little more quickly as id selector of jQuery.

更新2::该修补程序现在位于github上的jqGrid的主要代码中(请参见此处)

UPDATED 2: The fix is now in the main code of jqGrid on the github (see here)

这篇关于IE8中的Jqgrid treegrid性能问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！