Question

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

以下是我使用Chrome网络浏览器进行的测试（数据来自网络标签使用）：

datatables插件已开启：
5476 记录：
24 requests ❘ 256.26KB transferred ❘ 19.80s (onload: 19.80s, DOMContentLoaded: 18.58s)
45071 记录：
34 requests ❘ 1.85MB transferred ❘ 11.1min (onload: 11.1min, DOMContentLoaded: 11.0min)

datatables插件已关闭（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条记录来忽略这一点？

任何建议都表示赞赏！

Answer 1

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

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

如果你目前没有使用延迟渲染，那么你的行数为45'000，我肯定会建议这样做。如果不这样做，对于DataTables选项，您可能需要查看server-side processing。

Answer 2

艾伦的回答很好;但另外一件事（这会极大地影响加载时间）是将bProcessing和bServerSide设置为true，如下面的代码所示：

$(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秒钟。）

Answer 3

我发现浏览器插件也会降低DataTable的性能，这在我的情况下。表格本身的加载时间从大约15秒到2秒不等。

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

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

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

<meta name="SKYPE_TOOLBAR" content="SKYPE_TOOLBAR_PARSER_COMPATIBLE" />

jQuery datatables插件太慢 - 需要更换

3 个答案: