如何获取 javascript/dom 加载和处理时间的指标

Question

我们发现自己在一个能够与超过 20k 用户实时合作的网页中工作。

我们非常努力地优化后端系统，但我们现在需要在前端进行优化。

我想到的第一件事是使用一些工具来监控 JS 文件的加载时间。

但是我们真的不需要知道加载 javascript 的时间，我们真正需要的是知道我们的 javascript 代码的哪些部分需要更多的时间来完成。

现在我们正在使用 new relic 来跟踪我们的网站，并了解需要优化哪些服务器端脚本。

但我看不到任何关于前端代码或巫婆文件的指标需要优化。

有什么工具可以帮助我们解决这个问题？

Answer 1

测试你的 javascript 跨浏览器速度的最好方法是编写你自己的函数。 将您想要测试的任何代码包装到一个函数中，并在 1 秒内尽可能多地运行该函数，计算迭代次数。至少运行该测试五次，因为每次都会得到不同的结果，然后找到平均迭代次数。我还建议使用 chrome，因为它在 javascript 性能方面比任何其他浏览器快约 4 倍。测试您的所有代码并针对您的浏览器进行优化，改进也会影响您的用户体验。

我有自己编写的 speedTest obj，您可以在我的网站http://www.deckersdesign.com/source.php 上查看，它正在建设中。仅供参考，这个 obj 找到迭代的中位数而不是平均值。