google-chrome-devtools - 如何在 JS 源代码中显示行级分析?

标签 google-chrome-devtools

我已阅读 this article关于分析运行时性能。下面的图片是从这篇文章中复制的。如果您查看此图像,则文件中每一行旁边都有黄色突出显示的 JS 文件的执行时间提示。

我发现这个行级分析功能非常有用,我也想在我自己的项目中尝试它。

但是,当我在源选项卡中打开一个 JS 源文件时,我看不到它。请注意,我已经拍摄了性能分析快照。但我仍然看不到这个执行时间提示。

如何显示此功能?

谢谢。

enter image description here

最佳答案

它似乎已移至新标签页。
你可以试试这个:

  • 打开 javascript 配置文件选项卡(或 ctrl+ shift + p 在 win 上输入 javascript 配置文件)
  • 开始记录站点并刷新
  • 停止记录
  • 单击其中一个 js 文件
    enter image description here
  • 你得到了你所需要的
    enter image description here
  • 关于google-chrome-devtools - 如何在 JS 源代码中显示行级分析?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51775071/

    相关文章:

    google-chrome - 当我打开开发人员工具(检查元素)时,谷歌浏览器会自动重新加载页面

    javascript - 如何判断HTTP GET请求是否是console/firebug/IE9 F12发出的?

    google-chrome-devtools - 在 devtools 调试器中是否有关闭源选项卡的快捷方式?

    javascript - 您可以在 chrome devtool 中查看以前/当前值吗?

    google-chrome - Chrome 检查器 - 远程调试器 - 在托管模式下未启用剪贴板。请使用 chrome ://inspect 检查

    javascript - 找到从未命中非库代码的 Backbone.js 事件错误源

    google-chrome-devtools - Chrome devtools更改“元素”选项卡的布局

    http - html 文件和加载的 DOM 内容之间有 400 毫秒的差距?

    javascript - 从 google chrome 浏览器控制台在 Netflix 上设置视频播放速率

    go - 使用 Chromedp 单击按钮