使用Chrome开发工具在JavaScript中查找无限（或非常大）的循环

Question

我使用的第三方统计资料库似乎有很多问题。它既大又压缩，所以它不是特别容易调试。我正在使用Chrome开发工具，我想知道可能有什么选项可以通过名字调用次数对功能进行排名？我认为答案是Profiler选项卡，但我捕获的配置文件仅记录引用的JS文件＆＃34;第1行和第34行;在长链中。

这件事冻结了我的应用程序，我宁愿尽可能避免对代码进行更改，即使它是为了调试。我很乐意澄清任何不清楚的事情。

编辑：我似乎记得最近在某处展示了一个chrome dev工具的演示，其中显示了一个时间线，该时间线描绘了根据水平时间增量垂直堆叠的功能块＆＃34;火焰图＆＃34;或类似的东西......这将是理想的，但我现在无法记住我的生活链接。如果有人知道这个工具是什么的话，不反对在这个上使用Canary吗？

Answer 1

关于DevTools的最新视频在http://youtu.be/x6qe_kVaBpg?t=19m44s

它涵盖了有关DevTools的不同主题，并且还包含有关CPU配置文件的部分。

因此，您需要记录一个cpu配置文件并查看它。

您也可以使用FlameChart视图。

您可以单击BottomUp或TopDown中的项目，甚至可以单击FlameChart栏，并在Sources面板中查看功能正文。

如果您的来源缩小，如屏幕截图所示，则可以按“来源”面板状态栏中的按钮。它看起来像两个花括号{}。然后DevTools将格式化源。

并且该操作将影响所有其他位置（如Timeline，CPUProfile等）中源文件的所有链接。例如，在第一个快照中，您看到了一个函数O.Pk，该函数位于脚本缩小版本的第778行。在相当打印源文件后，该功能的链接自动更改。现在它指向15871行。

Answer 2

看起来答案是“时间轴”标签。似乎在普通镀铬工作。我将标签设置为在触发导致挂起的操作之前记录，一旦挂起停止（大约需要20秒），我停止录制并使用左右选择器放大主时间轴（在顶部）我看到更长的执行期（在顶部）选择了“事件”。

从那里我只是扩大了下拉菜单，我得到了我想要的东西。 （我模糊了js文件名以避免单独删除库）但我包含了一个截图。