full - jqgrid guriddo

Problemas de rendimiento de la cuadrícula de árbol Jqgrid en IE8

Question

Estoy usando jqgrid treegrid para cargar los datos de forma remota en el evento de expansión. Está recuperando los datos rápidamente, pero se está tardando en cargarlos en el lado del cliente y también en colapsar el nodo, lo que está dando error de detención de script en IE8. En FF y Chrome, lleva tiempo, pero funciona sin errores de scripts. Solo tengo 480 registros para mostrar, pero treegrid muestra un enorme inconveniente de rendimiento. Error de IE8 al contraer el nodo FEB-2012 ...

Answer 1

Probé tu demo y tengo un consejo caliente para mejorar el rendimiento de forma espectacular. La razón es la línea dentro de expandRow :

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

y otra línea dentro del colapsoRow :

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

Las líneas usan $t.grid.bDiv como el parámetro de contexto jQuery. Se deduce que los datos de $t.grid.bDiv fill se buscan sin usar el índice existente para los ids. En caso de que la cuadrícula no tenga duplicados de identificación (lo cual sería un error en los datos), se puede eliminar el parámetro $t.grid.bDiv

La demostración es idéntica a su demostración original, pero utilicé el código fijo de la función donde las líneas anteriores son reemplazadas por

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

y

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

Usé el jqGrid 4.1.1 jquery.jqGrid.min.js original, pero sobrescribí el código solo con la función expandRow y collapseRow con

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

Creo que uno puede mejorar más el rendimiento del código, pero al menos el simple cambio puede mejorar dramáticamente el rendimiento del colapso o la expansión de los nodos de los árboles que tienen muchos elementos.

ACTUALIZADO: Publiqué justo ahora la solicitud de extracción que corrige el problema descrito anteriormente en el código principal de jqGrid. Decidí usar $($t.rows.namedItem(id)) lugar de lo descrito anteriormente $ ("#" + $. Jgrid.jqID (id)). No midí exactamente el rendimiento, pero el uso de namedItem debería ser el más parecido al código jqGrid original y espero que funcione un poco más rápido como selector de id de jQuery.

ACTUALIZADO 2: La solución ahora está en el código principal de jqGrid en el github (ver aquí )