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

Question

当分析器将（程序）以 80% 置于顶部时，我将如何确定我的 javascript 应用程序中的挂断是什么？我的逻辑是否太复杂而无法进行热点跟踪？我的内存占用太大了吗？一般是什么原因造成的？

更多信息：

• 除了一个画布标签之外，表单上没有任何元素
• 没有等待通信 (xhr)
• http://i.imgur.com/j6mu1.png

Answer 1

空闲周期（“什么都不做”）也将呈现为“（程序）”（您可以分析此 SO 页面几秒钟并获得 100% 的（程序）），所以这本身并不是坏事的迹象。

另一件事是当您实际看到您的应用程序滞后时。然后 (program) 将由 V8 绑定代码（以及它们调用的 WebCore 代码，本质上是任何东西：DOM/CSS 操作、绘画、内存分配和 GC，等等。）如果那是这样的话，你可以记录下你的应用的Timeline（切换到开发者工具的Timeline面板，按下底部状态栏的Record按钮，然后运行你的应用一段时间.) 您将看到许多内部事件，其时间安排为水平条。您将看到重排、样式重新计算、计时器触发、GC 事件等等（顺便说一句，最新的 Chromium 版本具有改进的内存分析器使用时间线，因此您也可以监控某些内部因素使用的内存。）

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

Answer 2

看到这个链接：它会帮助你Understanding Firebug profiler output

我会说你应该检查哪些方法采用 %.您可以最大限度地减少不需要的程序。我在你的图中看到了一些 draw 方法正在消耗大约 14%，它在后台运行。可能是因为你的 JS 加载缓慢。你应该确定什么需要时间。 FF 和 Chrome 都有显示网络流量的功能。看看yslow，他们有一个很棒的 Firebug 插件。

我会推荐一些 Chome 的审计工具，它们可以告诉你很多关于为什么会发生这种情况，你可能应该包括更多关于：

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

无论如何，即使没有所有这些，这里有一个清单可以为您提高性能：

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

看看YSlow plugin 和Google PageSpeed，它们都对提高性能非常有用。

Answer 3

要检查它是否由于内存选项而变慢，请使用：chrome://memory

您也可以查看chrome://profiler/ 以了解正在发生的事情的可能提示。

另一种选择是在此处发布您的 javascript 代码。