Google Chrome开发人员工具运行速度非常慢

Question

SinсeGoogleChrome已更新至50.x版本，无法使用DevTools。此问题主要在“网络”标签中重现。每次点击“请求”时，大约需要30-40秒。之后，铬可以崩溃。试图删除所有扩展，清除缓存，并重新安装，但没有帮助。有人知道如何解决这个问题吗？

我正在运行Chrome 50.0.2661.87 m

UPD：由于标题较长，可能会出现问题。尝试关闭响应并请求标题。

Answer 1

我在Mac OS X 10.11.3上的Chrome版本50+中遇到过类似的调试问题。到目前为止，我发现的唯一解决方案是保持开发工具停靠在右侧，它似乎与以前一样高效。不是最佳解决方案，但它适用于我的情况。

Answer 2

我的情况类似，经过一段时间的极度缓慢的开发人员工具响应我发现问题是由我为knockoutJs安装的Chrome扩展引起的。 因此，对于遇到这些问题的人，作为初始问题排查的一部分，请尝试停用Chrome扩展程序。

Answer 3

我正在使用版本61.0.3163.79，我有同样的问题，这篇文章谈到了。

通过一些搜索，我发现问题出在我正在使用的用户身上。我尝试的是以访客身份输入int google chrome，devtools再次变得更快。

所以我做的是：

1. 检查使用来宾用户的调试是否更快。
2. Logout from the account。
3. Clean all cache associated to google chrome.
4. 重新启动电脑（但我认为关闭浏览器就足够了）
5. Login again in your account。

我希望这可以帮助其他有相同问题的人。

[编辑：]

我发现在一段时间（几周）之后谷歌Chrome开发工具将再次变慢。所以我尝试了以下解决方案并且有效：

1. 打开dev tools
2. 转到Sources标签。
3. 清除所有观察到的变量，断点，DOM断点和事件监听器断点。

[第二次编辑：]

几周后，问题再次出现。我所做的是安装google canary Version 64.0.3249.2 canary (64-bit)，我的问题就消失了。

如果谁不知道什么是金丝雀，请查看this链接。

Answer 4

Google意识到了这个问题 - https://bugs.chromium.org/p/chromium/issues/detail?id=624097

这个问题似乎在第53节中消失了 - 他们目前正试图找出解决问题的方法。如果可能，修复程序将合并回v.52。但至少他们正在研究它。

Answer 5

如果其他人到达此处面临同样的问题，请尝试更改您正在查看元素的开发工具标签。

我有＆＃34;来源＆＃34;标签打开，Chrome正在尝试为该标签加载大量资源，这会在我创建的console.log()个事件和这些已记录消息的显示之间产生多秒延迟。

Answer 6

最后，已经找到了一种解决方案，该解决方案在经过这么长时间和多次失败的修复后对我有所帮助：Solution on Google Chrome Forums

  

转到chrome://flags/#force-color-profile

     

将其更改为sRGB

Answer 7

我在54.0.2840.99 m版Google Chrome浏览器上遇到了同样的问题。

但切换到Chrome Canary工作了！

Answer 8

我也面临同样的问题。

我尝试了未选中的切换屏幕录像。现在工作正常。

Answer 9

我通过执行以下操作再次加速了Chrome：

• 打开 DevTools ->选择 Elements 标签->
  在过滤器下选择
  • 嵌套的 Compute 标签->，确保未选中 Show all 。
  • 选择嵌套的 Event Listeners 标签->确保未选择 Ancestors 和 Framework监听器。

Answer 10

通过停用所有断点让devtools再次运行：

转到Sources标签，显示调试器（可能已隐藏）并点击Deactivate breakpoints。

（Windows 10上的Chrome v62.0）

Answer 11

缩小resource的大小为overridden

只有overriding个文件具有较少的代码行对我来说效果很好。我到达这里是因为我是overriding个文件，其中有35,000 +行的Javascript行。

此外，如果您的resource是新的-即它不包含在script标记或link标记中，则可以override main html document并添加标签：<script src="/my-new-script.js"></script>。将文件添加到Overrides folder上Chrome内的域根目录中：

overriding HTML

然后overriding自定义脚本：

祝你好运...

Answer 12

就我而言，我在Downloads文件夹中有Local Overrides设置（https://developers.google.com/web/updates/2018/01/devtools#overrides），其中包含很多文件，这减慢了devtools的速度。

在其自己的单独目录中设置替代可以解决缓慢问题。

Answer 13

对我来说，在Ubuntu 18上运行Chrome版本81.0.4044.138（正式版本）（64位），问题似乎出在移动视图上。 禁用移动视图后，检查又变得非常快。我认为这是由触摸仿真和其他移动设备引起的。

要具有类似于移动视图的功能，请将DevTools停靠栏移到侧面并调整其大小，直到获得所需的宽度为止。它并不完美，但是在大多数情况下都是有用的。

除Chrome之外，Firefox整体检查站点时速度要快得多，尽管我不使用FF，因为我已经习惯了Chrome上的特定功能。此外，与我合作的大多数网站都不会在Chrome上触发这些问题，实际上，只有一个网站会发生这种情况。

PD ：在Chrome开发工具上触发该问题的网站包含许多CSS变量。不确定是否相关。

更新1周前 通过禁用“显示媒体查询”选项，即使在移动视图下，我也可以使用Chrome而不出现问题