Forum
Log In
Home
Topic RSS
20:20
07/04/2014
Offline
Looking to see if anyone had ideas about making jqGrid perform better with larger datasets. I have around 1000 rows and 30 columns. It takes over 6 seconds to display the grid (not including retrieving the data) in Internet Explorer. Chrome is slow too, but IE is by far the worse. Using a small page size makes it perform better, but this is not acceptable to my users. Has anyone else solved this? I must use frozen columns as well.
<!DOCTYPE html>
<head>
<link rel="stylesheet" type="text/css" media="screen" href="./jqgrid/4.6.0/css/ui.jqgrid.css" />
<link rel="stylesheet" type="text/css" media="screen" href="./jquery-ui/1.9.2/css/smoothness/jquery-ui-1.9.2.custom.css" />
<script type="text/javascript" src="./jquery/1.9.1/jquery-1.9.1.js"></script>
<script type="text/javascript" src="./jquery-ui/1.9.2/js/jquery-ui-1.9.2.custom.js"></script>
<!-- jqgrid -->
<script src="./jqgrid/4.6.0/js/i18n/grid.locale-en.js" type="text/javascript"></script>
<script src="./jqgrid/4.6.0/js/jquery.jqGrid.js" type="text/javascript"></script>
<script type="text/javascript" src="./js/data.js"></script>
<style>
html,body {
 height: 100%;
 overflow: hidden;
}
.ui-jqgrid .ui-pg-input {
 height:inherit;
}
</style>
</head>
<body>
 <label for="pages">Pages:</label><input id="pages" type="number" min="1" max="10" step="1" value="1" name="pages"/>
 <table id="gridTableId">
 </table>
 <div id="pager"></div>
</body>
<script type="text/javascript">
 var columns =
   [
     {
      "label" : "columnDataA",
      "id" : "columnDataA",
      "name" : "columnDataA",
      "classes" : "columnDataA",
      "frozen" : true,
      "width" : 143,
      "title" : true
     },
    Â
// .... columns deleted for brevity...
     {
      "label" : "columnDataEE",
      "id" : "columnDataEE",
      "name" : "columnDataEE",
      "classes" : "columnDataEE",
      "frozen" : false,
      "width" : 129,
      "title" : true
     } ];
 var creategrid = function () {
  var start = now();
  $("table").jqGrid({
   datatype : 'clientSide',
   loadui : "disable",
   data : data,
   colModel : columns,
   reload : false,
   scroll : false,
   sortable : false,
   gridview : true,
   shrinkToFit : false,
   loadonce : true,
   rowNum : data.length/getPages(),
   width : $(window).width()-30,
   altRows : true,
   headertitles : true,
   altclass : "odd",
   pager: "#pager",
   pgbuttons: true,
   height : $(window).height()-100
  });
  $("table").jqGrid('setFrozenColumns');
 };
Â
 $(document).ready(function() {
  creategrid();
 });
 var getPages = function () {
  var value = $("#pages").val();
 Â
  if($.isNumeric(value)) {
   return value;
  }
 Â
  return 1;
 Â
 };
Â
</script>
</html>
11:56
Moderators
30/10/2007
Offline
Hello,
Which version of jqGrid is used? Which version of IE is slow?
Try to remove the frozen columns and see the result.
The number of rows is not a problem - the number the columns is a problem in IE.
If you reduce the columns to 15 what is the result?
Kind Regards
For professional UI suites for Java Script and PHP visit us at our commercial products site - guriddo.net - by the very same guys that created jqGrid.
20:32
07/04/2014
Offline
I'm using jqGrid 4.6.0. Â I tested in both both IE8 and IE11. Â It seemed about the same. Â I took columns from 30 to 15. Â 15 columns and 1000 rows in IE8 is taking around 4.2 seconds. Â 15 columns and 500 rows is taking about 2.2 seconds. Â I probably have some flexibility with business requirements on the page size, but reducing the number of columns will be a harder sell.
Most Users Ever Online: 715
Currently Online:
32 Guest(s)
Currently Browsing this Page:
1 Guest(s)
Top Posters:
OlegK: 1255
markw65: 179
kobruleht: 144
phicarre: 132
YamilBracho: 124
Renso: 118
Member Stats:
Guest Posters: 447
Members: 11373
Moderators: 2
Admins: 1
Forum Stats:
Groups: 1
Forums: 8
Topics: 10592
Posts: 31289
Newest Members:
, razia, Prankie, psky, praveen neelam, greg.valainis@pa-tech.comModerators: tony: 7721, Rumen[Trirand]: 81
Administrators: admin: 66
