chrome中的javascript执行缓慢，分析器产生“（程序）”

Question

当探查器将（程序）置于80％的顶部时，我如何确定我的javascript应用程序中的挂断？我的逻辑是否太复杂，无法进行热点跟踪？我的记忆足迹太大了吗？这通常是什么原因？

更多信息：

• 表单上没有元素保存一个canvas标签
• 没有等待通讯（xhr）
• http://i.imgur.com/j6mu1.png

Answer 1

空闲周期（“无所事事”）也将呈现为“（程序）”（您可以将此SO页面分析几秒钟并获得100％的（程序）），这样这本身并不是一件好事的迹象。

另一件事是你实际看到你的应用程序滞后。然后（程序）将由V8绑定代码（以及它们调用的WebCore代码提供，基本上是任何东西：DOM / CSS操作，绘画，内存分配和GC，什么不是。）如果那样如果是这样，您可以录制应用程序的时间轴（切换到开发人员工具中的Timeline面板，然后按下底部状态栏中的Record按钮，然后运行申请一段时间。）你会看到很多内部事件，他们的时间是水平条。您将看到回流，样式重新计算，定时器触发，GC事件等等（顺便说一句，最新的Chromium版本具有改进的内存分析器使用时间线，因此您也可以监视某些内部因素使用的内存。）< / p>

要诊断内存问题（需要多次完整GC循环的多次分配），您可以使用Profiles面板。在代码的密集部分开始之前获取堆快照，在此代码运行一段时间后再执行另一个快照。然后比较两个快照（底部的右侧SELECT），看看发生了哪些分配，以及它们对内存的影响。

Answer 2

要检查是否因使用内存选项而变慢：chrome://memory

此外，您可以查看chrome://profiler/，了解可能的提示。

另一种选择是在这里发布你的javascript代码。

Answer 3

请参阅此链接：它会在Understanding Firebug profiler output

中为您提供帮助

我会说你应该检查哪些方法占％。您可以尽量减少不需要的程序。我在你的图中看到，一些draw方法消耗了大约14％，它在后台运行。可能是因为你的JS加载缓慢。你应该确定花时间。 FF和Chrome都具有显示网络流量的功能。看看yslow，他们对Firebug有很好的补充。

我会建议一些Chome的审核工具可以告诉你为什么会发生这种情况，你应该包括更多的信息：

1. 连接服务器需要多长时间？
2. 转移内容需要多长时间？
3. 您同时在该页面上加载了多少其他内容？

无论如何，即使没有这一切，这里还有一个提高你性能的清单：

• 确保您的javascript被视为静态内容，例如通过nginx / apache /无论是直接还是cdn，都没有达到您的应用程序框架
• 调查您是否可以使用CDN来提供javascript，有时甚至将不同的域名指向您的服务器会产生积极的影响，例如：而不是http://example.com/blah.js - ＆gt; http://cdn2.example.com/blah.js
• 确保您的js提供了正确的过期标头，每次客户端刷新页面时都不要重新下载
• 开启js内容的gzipping
• 使用不同的工具（例如，使用Google封闭编译器）缩小您的js
• 合并您的脚本（减少请求数量）
• 将您的脚本标记放在
之前
• 调查并清理/优化您的onload和document.ready hooks

查看YSlow plugin和Google PageSpeed，两者在提高效果方面都非常有用。