Chrome 分析器中的 Javascript 计数函数调用

Question

是否可以从 Chrome 配置文件(开发者工具)中获取函数调用次数的信息？
我找到了如何在代码中做到这一点:

console.count("Function called");

和一些非常古老的(2011 年及前后)主题和功能请求，如 this one .但如果可以记录每个函数调用的计数，则没有新信息。

有时你会发现有些调用在一秒钟内被调用多次，如果只调用一次会大大提高性能(为执行添加一些延迟)。为了跟踪此功能计数器是必要的。

Answer 1

您不会在时间轴/CPU 分析器中看到函数调用计数，因为 Chrome 开发工具中的标准分析器是一个采样分析器。

采样分析器以预定义的时间间隔获取执行堆栈快照。当它即将执行时，JS 执行暂停，并记录当前执行堆栈上的函数。这就是您在时间线的火焰图中看到的。

鉴于所描述的行为，应该清楚采样分析器可以不记录所有函数调用(可以调用函数并在 2 次测量暂停之间完成其执行)。

还有其他分析器可以记录所有 函数调用，最容易使用的可能是Web Tracing Framework。 .它通过检测您的代码来工作(通过用测量代码包装每个函数调用来重写它)。 WTF 需要更多时间来设置(检测步骤)并且会对测量的时间产生影响(因为它注入(inject)新代码)但至少可以显示所有函数调用。

归根结底，没有一款分析器可以完美适用于所有跟踪作业。您需要根据要测量的内容使用不同的。有一篇关于不同分析器细节的精彩演讲，强烈推荐:https://www.youtube.com/watch?v=nxXkquTPng8