15

我已经使用 jQuery 数据表插件大约两年了，到目前为止效果很好。当我需要一次加载大约45000条记录时，现在出现了问题（您单击按钮并等待加载数据的页面） - 加载时间太长而无法等待。

这是我使用 Chrome 网络浏览器进行的测试（数据来自它的网络选项卡使用）：

数据表插件打开：
5476条记录：45071条记录：
24 requests ❘ 256.26KB transferred ❘ 19.80s
(onload: 19.80s, DOMContentLoaded: 18.58s)

34 requests ❘ 1.85MB transferred ❘ 11.1min
(onload: 11.1min, DOMContentLoaded: 11.0min)

数据表插件关闭（jQuery数据表初始化被注释掉）：
5476条记录：
21 requests ❘ 255.84KB transferred ❘ 6.57s
(onload: 13.26s, DOMContentLoaded: 13.28s)

45071条记录：
31 requests ❘ 1.84MB transferred ❘ 2.0min
(onload: 2.0min, DOMContentLoaded: 2.0min)

45k 行的数据表加载时间增加了80%以上，5k 行增加了近40%。

所以我想知道你们是否知道任何类似的插件可以更快地处理很多行（45000+），或者我只是通过尝试“一次性”加载所有 45000+ 记录而错过了重点？

任何建议表示赞赏！

4

3 回答 3

28

从 DataTables 常见问题解答 ( http://datatables.net/faqs#speed )：

  • 客户端处理 - DOM 源数据：~5'000 行。速度选项：bSortClasses
  • 客户端处理 - Ajax 源数据：~50'000 行。速度选项：bDeferRender
  • 服务器端处理：数百万行。

如果您目前不使用延迟渲染，对于 45'000 行，我肯定会建议您这样做。如果做不到这一点，对于 DataTables 选项，您可能需要查看server-side processing。

于 2012-07-25T09:32:48.957 回答
4

艾伦的回答很好；但要提到的另一件事（极大地影响加载时间）是设置bProcessing和bServerSide为真，如下面的代码所示：

$(document).ready(function() {
    $('#example').dataTable( {
        "bProcessing": true,
        "bServerSide": true,
        "sAjaxSource": "../examples_support/server_processing.php"
    } );
} );

参考。http://datatables.net/examples/data_sources/server_side.html

我的代码加载需要 15 秒，现在需要 1 秒 :)

于 2014-01-05T18:03:56.833 回答
2

我发现浏览器插件也会降低 DataTable 的性能，这就是我的情况。表本身的加载时间从大约 15 秒变为 2 秒。

其中之一是Skype 工具栏，它会自动解析表格中的数据，除非你告诉它不要这样做。

这对于大表来说是个问题。很多用户都有这个插件，它在不知不觉中减慢了他们加载大表的速度。

对此有一个很好的解决方案，将其添加到标题中。每个公开的 DataTables 网页都应包含以下内容：

<meta name="SKYPE_TOOLBAR" content="SKYPE_TOOLBAR_PARSER_COMPATIBLE" />
于 2015-11-24T14:41:04.963 回答