0

我正面临这种情况。我有一个大约 3500 行的网格。而且这个网格应该是跨浏览的，特别是在 IE6 中（这是客户端的浏览器......不幸的是）。

当我在 IE6 中进行测试时，加载时间比其他浏览器要多。看到这个后，我决定优化查询，现在它只加载必要的数据库字段，但在 IE 中加载仍然很慢。我的数据类型是JSON.

除了这种不便之外，我发现所有浏览器的过滤速度都很慢（在 IE6 中比其他浏览器花费更多时间）。我在过滤器中使用了选项searchOnEnter : false，在 IE6 中按列排序也很慢。

当我使用按列过滤和排序时，我可以做些什么来减少加载时间？我仍在网上冲浪，试图找到一个可能的解决方案，但我的想法已经不多了。

提前致谢。

更新：jQGrid代码

var myGrid = $('#bookingsList');
myGrid.jqGrid({
    jsonReader : { root: "rows", repeatitems: false, id: "0", cell: ""},
    url:'/WebBooking/json/bookingListAct.action',
    datatype: 'json',
    mtype: 'POST',
    colNames:['Id','Site','CompanyId','Created'],
    colModel :[
    {name:'bestillingId', index:'bestillingId', width:45, sorttype: 'int'}, 
    {name:'stedName', index:'stedName', width:90},
    {name:'firmaId', index:'firmaId', width:200, hidden:true}, 
    {name:'creationDate', index:'creationDate', width:105, search:false}
    ],
    pager: '#pager',
    rowNum:10,
    rowList:[10,50,100,150,200,250,500],
    sortname: 'bestillingId',
    sortorder: 'desc',
    viewrecords: true,
    gridview: true,
    loadonce: true,
    sortable: true,
    rownumbers: true,
    autoencode: true,
    ignoreCase: true,
    shrinkToFit:false,
    width: 1050,
    height: '100%'
});

更新：JSON字符串（一部分）

{"page":"1","records":"3180","rows":[{"stedName":"Mongstad","bestillingId":"2","firmaName":"Reinertsen AS","creationDate":"13.09.11 09:01"}],"total":"318"}

4

1 回答 1

1

当前代码中的主要问题是loadonce: true. 在这种情况下，实现url:'/WebBooking/json/bookingListAct.action'非常简单：您只将所有数据返回到 jqGrid。尽管如此，在您应该对数据进行排序的情况下，这些事件sortname: 'bestillingId'将sortorder: 'desc'在服务器上（在 中bookingListAct.action）作为sidx和sord参数显示。

您应该了解，在使用的情况下，loadonce: true数据的排序、分页和过滤将在客户端以 JavaScript 代码实现。您如何知道 JavaScript 主要是解释器，并且不会编译代码（至少在旧的 Web 浏览器中）。因此，在客户端对数据的排序比在服务器上编译的本机代码慢很多倍（或数千倍）。如果您将数据保存在数据库中并且在您允许排序或过滤的列上有索引，那么在服务器端实现中排序和过滤将更快。

所以我的主要建议是实现服务器端排序、分页和过滤。

要在服务器端实现排序，您应该在相应的 SQL语句sidx中sord构造。ORDER BYSELECT

要在服务器端实现分页，您应该使用来自page和rows参数的信息。您可以使用SELECT TOPandLEFT OUTER JOIN或LIMITandSKIP取决于您使用的 SQL 方言（请参阅此处）一些详细信息。

要实现过滤，您应该首先使用filterToolbarstringResult: true选项来获取有关要以高级搜索格式发送的过滤器的信息（请参阅此处）。JSON 字符串形式的完整过滤器将作为参数发送到服务器。此外，它将发送布尔参数。在服务器端，您应该将参数从 JSON 字符串转换为对象并解析信息。然后你应该使用这些信息来构造相应语句的一部分。filters_searchfiltersWHERESELECT

If all information sorting, paging and filtering are exist in the request to the server then you should first filter the data, sort the results and the get the requested page from the results. The records and total values in the server response should take in the consideration the filtering. So if the filtered data consists for example from 12 rows and the page size is 10 you should return "records": 12, "total": 2 instead of "records": 3180, "total": 318 which you have in unfiltered data.

I don't use Java myself. I am not sure whether it helps you but in the answer you will find and download Visual Studio C# project which implement paging, sorting and filtering.

The last remark. The row of data which you returns from the server currently looks like

{"stedName":"Mongstad","bestillingId":"2","firmaName":"Reinertsen AS",
    "creationDate":"13.09.11 09:01"}

如果您将repeatitems: true数据的默认格式与您一起使用id: "0", cell: ""，则可以将行所需的数据替换为

["Mongstad","2","Reinertsen AS",:"13.09.11 09:01"]

它将减少数据的大小并额外提高性能。此外，我个人不喜欢以"13.09.11 09:01". 这种形式是本地化的，将被解释为字符串，因此无法正确排序和过滤。最好以ISO 8601格式返回数据：2011-109-13T08:01Z或2011-109-13T09:01+01:00. 您可以formatter: 'data'使用formatoptions: { srcformat: 'ISO8601Long', newformat: 'd.m.y H:i' }.

于 2012-05-15T10:23:38.327 回答