我有一个大数据应该显示在一个表格中。 我使用 javascript 来填充表格，而不是在 HTML 中打印。
这是我使用的示例数据：
var aUsersData = [[1, "John Smith", "...."],[...],.......];
问题是 Firefox 警告我“正在运行一个繁重的脚本，我应该继续还是停止？”
我不希望我的访问者看到警告。我怎样才能使性能更好？ jQuery？纯脚本？还是您推荐的其他图书馆？
【问题讨论】：
标签： javascript jquery performance datatable
您可以使用此处的方法显示进度条，而不会让浏览器锁定您。
http://www.kryogenix.org/days/2009/07/03/not-blocking-the-ui-in-tight-javascript-loops
我在这个页面上几乎使用了那个方法：
让浏览器在加载时不挂起并显示反馈。
【讨论】：
jQuery 通常不会让事情变得更快，只是更容易。我使用 jQuery 来填充表格，但它们非常小（最多 2 列乘 40 行）。您将多少数据填充到表中？这可能是限制因素。
如果您发布一些表格填充代码，我们可以看看是否有可能以任何方式提高性能。
【讨论】：
我怀疑这两种方式都不会产生太大影响，尽管有时添加像 jQuery 这样的抽象层会影响性能。或者，jQuery 团队可能已经找到了一种晦涩的、非常快速的方法来完成某些事情，如果您不使用它，您会以一种更明显但更慢的方式来完成。这一切都取决于。
无论如何都适用的两条建议：
首先，由于您已经依赖启用了 JavaScript 的用户，因此我会使用分页和可能的过滤。我的怀疑是它正在构建需要时间的表。无论如何，用户都不喜欢滚动浏览很长的表格，向页面添加一些分页和过滤功能以仅向他们显示他们真正想要查看的数组中的条目可能会有很大帮助。
其次，在构建表时，方式可能会对性能产生很大影响。这似乎有点违反直觉，但在大多数浏览器中，构建一个大字符串然后设置容器的 innerHTML 属性通常比一遍又一遍地使用 DOM createElement 函数来创建每一行和单元格要快.最快的整体往往是将字符串推入数组（而不是重复连接），然后join 数组：
var markup, rowString;
markup = [];
markup.push("<table><tbody>");
for (index = 0, length = array.length; index < length; ++index) {
rowString = /* ...code here to build a row as a string... */;
markup.push(rowString);
}
markup.push("</tbody></table>");
document.getElementById('containerId').innerHTML = markup.join("");
（这是原始的 JavaScript/DOM；如果您已经在使用 jQuery 并且更喜欢，那么最后一行可以重写 $('#containerId').html(markup.join(""));）
这比到处使用createElement 更快，因为它允许浏览器通过直接操作其内部结构来处理 HTML，而不是响应位于它们之上的 DOM API 方法。而join 的作用是有帮助的，因为字符串不会不断被重新分配，并且 JavaScript 引擎可以在最后优化 join 操作。
当然，如果您可以使用预先构建、预先测试和预先优化的网格，您可能希望使用它——因为它可以提供所需的分页、过滤器和快速构建，如果它是不错。
【讨论】：
你可以试试像PURE这样的JS模板引擎（我是主要贡献者）
它在所有浏览器上都非常快，并且保持 HTML 完全干净并与 JS 逻辑分离。
如果你更喜欢 类型的语法，还有很多其他的 JS 模板引擎可用。
【讨论】：