Javascript Google Chrome中常规和性能分析器模式的区别_Javascript_Angular_Animation_Google Chrome Devtools

Javascript Google Chrome中常规和性能分析器模式的区别

javascript angular animation google-chrome-devtools

Javascript Google Chrome中常规和性能分析器模式的区别,javascript,angular,animation,google-chrome-devtools,Javascript,Angular,Animation,Google Chrome Devtools,我正在尝试调试Angular 7应用程序中的JS（）动画，该应用程序在requestAnimationFrame上运行，但运行速度非常慢问题是-我无法在尝试记录性能配置文件时重现问题-应用程序在那里工作正常常规模式和性能配置文件记录模式之间的区别是什么？我试图关闭所有扩展并重新启动浏览器，但没有用你可以注意到轮子在常规模式下旋转得非常慢，旋转得又快又好，而我正试图用profiler记录下来我希望在profiler中看到性能问题，但当我尝试录制时，它可以正常工作与问题相关的模式有三种：

我正在尝试调试Angular 7应用程序中的JS（）动画，该应用程序在requestAnimationFrame上运行，但运行速度非常慢

问题是-我无法在尝试记录性能配置文件时重现问题-应用程序在那里工作正常

常规模式和性能配置文件记录模式之间的区别是什么？我试图关闭所有扩展并重新启动浏览器，但没有用

你可以注意到轮子在常规模式下旋转得非常慢，旋转得又快又好，而我正试图用profiler记录下来

我希望在profiler中看到性能问题，但当我尝试录制时，它可以正常工作

与问题相关的模式有三种：

开发工具已关闭

DevTools处于打开状态，而不是性能录制

DevTools已打开，并且正在运行性能录制

模式#2预计会比#1慢，因为DevTools为调试目的在运行页面中添加了大量挂钩

但是，当您运行探查器（模式#3）时，大多数挂钩都会被临时禁用

这导致模式中#1应该是最快的，#3稍微慢一点（由于分析），而#2是最慢的

在屏幕上我可以看到你在比较#2和#3。这是预期的#3更快。

p.s.阿尔普是一名开发工具工程师。@alph-tyvm详细回答，非常简单！哦，我的。。。这个问题一直困扰着我，我从来都不知道如何用谷歌搜索它。现在我终于找到了你的答案。我从来没有意识到在devtools打开的情况下会有多慢！