如何阅读和优化 Javascript 配置文件？答案

【问题标题】：How to read and optimize Javascript profile?如何阅读和优化 Javascript 配置文件？
【发布时间】：2012-04-14 12:16:12
【问题描述】：

我有一个通过 jQuery 更新网格中数百行的过程。这需要很长时间，所以我试图找出瓶颈首先在哪里，这样我就可以在那里工作。我尝试了 Chrome 的分析工具，但很难理解它（见截图）。由于 self 和 total 完全不同，我如何找出问题所在？

【问题讨论】：

【解决方案1】：

self 是直接在该函数中花费了多少时间。

total 是在该函数以及它调用的函数中花费了多少时间。

【讨论】：

【解决方案2】：

这里的瓶颈几乎可以肯定是 DOM（浏览器内部的方法），而不是任何特定的 JS 代码。

如果您显示的数据足够多，更新它会使浏览器锁定几秒钟，那么您真的应该考虑使用虚拟滚动网格。我最喜欢的是SlickGrid。

您可以将数据集存储在更轻量级的内存中 JS 对象中，而不是仅仅渲染一个巨大的表格。（因此，它可以比您当前正在执行的基于 DOM 的更新快一个数量级的修改和排序。）SlickGrid 仅呈现您正在查看的表格部分的 DOM 元素，因此压力要小得多浏览器。

您还可以一次选择load small chunks 的数据集（后端实现为简单的分页），使您能够在浏览器中以恒定的性能有效地显示无限行。

【讨论】：