Плохая производительность в jqGrid

Question

У меня плохая производительность с jqGrid, когда он загружает более 100 строк.Ниже приведен код, который я использую для ospatches данных из моего xml.Как я могу использовать параметр данных jqGrid в этом контексте, чтобы сделать его немного быстрее?

var ospatches=[];

$(xml).find('patch').each(function(){ 
var row={};
row.name=$(this).attr('name');
ospatches.push(row);
    });


$('#detailTable').empty();
$('<div width="100%">')
.attr('id','ospatchesSpan')
.html('<div class="titleBlue">Configuration&gt;System&gt;Os Patches</div>'+
    '<table id="list1" width="100%"></table>'+
    '<div id="gridpager"></div>'+
'</div>')        
.appendTo('#detailTable');    



jQuery("#list1").jqGrid({
datatype: "clientSide",
height: 250,
   colNames:['Name'],
   colModel:[
       {name:'name',index:'name', align:"right"},

   ],
   pagination:true,
   pager : '#gridpager',
   rowNum:10,
   scrollOffset:0,
   height: 'auto',
   autowidth:true,
viewrecords: true,
gridview: true,
edit:false,
add:false,
del:false

});



for(var i=0;i<ospatches.length;i++)
jQuery("#list1").jqGrid('addRowData',i+1,ospatches[i]);

jQuery("#list1").setGridParam({rowNum:10}).trigger("reloadGrid");

Answer 1

Я уже писал вам о преимуществах использования параметра data, но, вероятно, вы новичок в теме и не до конца понимаете, о чем я. Так что я сделал демо для вас. Он использует данные, которые вы разместили в предыдущем вопросе. Вы можете видеть, что 395 строк данных загружаются немедленно. Вы можете выбрать выпадающий список в пейджере, чтобы отобразить все строки одновременно, и вы увидите, что производительность очень хорошая.

Кроме того, я писал вам ранее, что вы можете упростить свой код, который воссоздает содержимое $('#detailTable') div. В демоверсии я использовал просто $("#list1").jqGrid('GridUnload').

Я включил код примера ниже:

$('#reload').click(function(){
    $.ajax({
        url:'ospatches.xml',
        dataType:'xml',
        success: function(xml) {
            var ospatches=[];
            $(xml).find('patch').each(function(){
                var row={};
                row.name=$(this).attr('name');
                ospatches.push(row);
            });

            $("#list1").jqGrid('GridUnload');

            $("#list1").jqGrid({
                datatype: 'local',
                data: ospatches,
                colNames:['Name'],
                colModel:[
                    {name:'name',index:'name', align:"right"}
                ],
                pager: '#gridpager',
                rowNum:10,
                rowList:[10,100,1000],
                height: 'auto',
                width: 500,
                viewrecords: true,
                gridview: true
            });
        }
    });
});