Question

我的Angular 2应用程序响应（1-5秒）关键输入，按钮点击，输入标签等操作缓慢仅 Chrome Developer Tools打开时。材料2动画也变得缓慢而且不稳定。

我已经开发了这个应用程序三个月了，每天都使用Chrome DevTools。这个问题似乎在一夜之间出现了。

我所知道的：

我存储了所有挂起的应用程序更改，以便将我的应用程序恢复到不存在问题的时间。问题依然存在。
Chrome DevTools似乎不会在同一个浏览器会话中减慢任何其他应用程序（即谷歌收件箱，谷歌地图）的速度。
疯狂地，当我运行DevTools'时间线“记录”以试图了解问题时，问题消失，页面再次以正常速度作出反应！我认为这是最好的线索我有，但我不知道DevTools的内部工作情况，足以知道“时间轴记录”如何改变事物。
我重新启动了Chrome并删除了所有缓存数据。
当我打开那些开发人员工具时，在Firefox或IE中没有发生任何类型的事情。

非常感谢任何有关下一步观看的建议！

Answer 1

我已经解决了这个问题，但我永远都不知道是什么导致了这个问题。可能是我不小心改变的环境。

我删除了Chrome应用并重新安装，一切都恢复正常。我打算将这个问题保持开放，以防其他人遇到此问题或想要做出贡献。

Answer 2

在打开Chrome开发工具的情况下，每个网络应用运行缓慢都是正常的。

特别是如果你打开了检查标签，它就像是同时打开的新页面+在任何块渲染上都有动画。

Answer 3

最终答案：

删除所有断点

即使他们没有被击中，这对我来说也已修复，并且性能恢复正常。

如果您记录了断点，则可能是一个更大的问题-因此，如果您已附加到断点，请尝试将其删除。

上一个答案：

我想出了一种解决方法-尽管仍然没有真正弄清楚实际出了什么问题。

我还发现了一堆我什至不知道的工具，这些工具以前没有被我跳过过-它们位于More tools下。

首先打开Performance Monitor。这显示了为您的Chrome标签页隔离的一个漂亮的CPU图形-Windows任务管理器像以往一样毫无用处。

这是我从mat-calendar中选择日期时得到的行为。没有其他逻辑在运行-仅选择日期。我从app-component删除了所有内容，然后放了mat-calendar，花了十秒钟来更改日期！

其他控件通常都可以。我可以打开对话框，使用组合框等，而且又快又好。但是选择一个日期给了我这个废话：

我尝试清空本地存储，清除缓存等，然后更改了网站的端口号。我只是将dev.example.com:44300更改为dev.example.com:44301-换句话说，Chrome现在认为这是一个不同的网站。

这是我切换端口号后的样子。

我还使用reverse proxy server获得了相同的效果-将我的本地计算机放到了互联网上-因此我可以尝试从其他计算机上复制该问题。我不能。

因此，希望对某人有所帮助-仍然不知道此服务器的缓存中有什么对性能产生巨大影响的内容。但是可以肯定的是，这不仅是我的代码。

还有其他一些尝试：

使用`--aot`标志进行测试

这对我没有什么影响，但可以缩小范围。

添加一些不做任何事情的控件（作为控件）

这样，您可以查找是否某些特定的操作或控制导致了速度下降。您当然应该能够立即切换它们。

只需打开和关闭它们，隐藏一些东西即可。

<mat-radio-group>
    <mat-radio-button [value]="false">
        bloop
    </mat-radio-button> 
    <mat-radio-button [value]="false">
        bloop bloop
    </mat-radio-button> 
</mat-radio-group>

启用渲染调试选项

确保您不会不断重新渲染整个页面

上面的渲染选项将在某种程度上显示此内容，但是我想做的一件事就是添加一个随机文本框-输入文本框，如果随后文本消失了，您就知道控件已被重新渲染。

 <!-- yes, just a standard text box -->
 <input type="text"/>

只需使用* ngIf =“ false”隐藏事物

隐藏控件（您和第三方），查看是否有任何问题引起问题。

对于我来说，我目前怀疑mat-calendar引起了问题-但对于启用“记录”功能使该问题不存在的原因，我仍然感到困惑。

Answer 4

我们今天在同事工作站上遇到了这个问题。原来，这是一个chrome扩展名（不记得了，它的名字带有“ ghost”）。因此，也许尝试使用访客模式并检查问题是否仍然存在。如果没有，请依次重新激活扩展，以查看引起问题的扩展。如果仍然发生，请遵循其他建议的方法。