我有一个要求,我必须在jqgrid中加载完整的数据(30,000行),数据能够成功加载。但是,如果我点击排序完成数据加载后,浏览器会挂起几秒钟,然后正确加载网格和排序数据。他们是否可以在排序时停止浏览器挂起或显示加载图标。
有关处理jqGrid中大量数据的任何建议
我正在使用静态数据加载网格,并且一次提取和加载500条记录。
我的网格代码为 -
$('#demo').jqGrid({
datastr : 'json',
datatype : "local",
sortable: true,
sortname : sortcol,
sortorder : asc, //sort order
colModel : colModelGrid, //Creating the grid model before jqgrid
page : 1,
height : '100%',
width : gridTotalWidth,
rowNum : 500,
rowTotal : bugCountTotal,
loadOnce : true,
loadui : "disable",
loadtext : "Loading...",
rownumbers : true,
//define column models
pager : '#' + pagerInfo, //set your pager div id
viewrecords : false,
search : true,
rowList : rowInfo,
caption : 'Complete Report',
scroll : true, // set the scroll property to 1 to enable paging with scrollbar - virtual loading of records
emptyrecords : 'Scroll to bottom to retrieve new page', // the message will be displayed at the bottom
data : bugDetails, //variable that stores complete data - Static data
beforeRequest : function () {
//Show Spinner
},
loadComplete : function (data) {
//Hide Spinner
return;
},
loadError : function (r, st, error) {
console.log("Error Loading Grid.");
},
});
答案 0 :(得分:0)
我发现减少页面中行数最重要。 rowNum : 500
的选择非常糟糕。没有监视器可以显示这么多行。性能的其他重要方面是列数。作为行数,它是更重要的方面。此外,提及您在测试中使用的Web浏览器非常重要。例如,IE浏览器的性能不如IE8的性能好得多。所有问题都应该写出你在测试中使用的jqGrid版本和哪个分支。
我为你做了the demo,它展示了网格的加载,排序和过滤时间,每页有20行显示13列和30000行。我使用了free jqGrid fork,我开发了它。您可以在浏览器中对其进行测试,这对您来说是最重要的,并且可以看到预期的性能。代码很简单。您可以使用http://jsfiddle.net/OlegKi/1rmmyeLh/9/在效果方面发挥更多作用。代码使用
rowNum: 20
我建议您尝试减少应用程序中的rowNum
值,并修改(至少是临时测试)jqGrid文件的URL以释放the wiki中描述的jqGrid URL。你应该看到性能优势。