Reactjs应用程序使用打开的Chrome开发工具降低速度

Reactjs应用程序使用打开的Chrome开发工具降低速度,reactjs,react-router,redux,react-redux,Reactjs,React Router,Redux,React Redux,我已经用React、Redux和React路由器构建了相当大的Web应用程序。在我用Chrome打开开发工具之前,它工作得很好,而且速度明显减慢了100倍。我曾尝试在Chrome中评测应用程序,但当我再次开始使用Chrome评测时,它开始以与关闭开发工具一样快的速度工作,一切正常 还检查了Safari和Opera-他们的开发工具也会减慢webapp的速度。为什么React/Chrome会严重影响性能?这是否意味着我误用了React,还是React+Chrome的常见问题?有什么解决方法吗?我今天

我已经用React、Redux和React路由器构建了相当大的Web应用程序。在我用Chrome打开开发工具之前,它工作得很好,而且速度明显减慢了100倍。我曾尝试在Chrome中评测应用程序,但当我再次开始使用Chrome评测时,它开始以与关闭开发工具一样快的速度工作,一切正常


还检查了Safari和Opera-他们的开发工具也会减慢webapp的速度。为什么React/Chrome会严重影响性能?这是否意味着我误用了React,还是React+Chrome的常见问题?有什么解决方法吗?

我今天注意到的一件事是,在某些情况下,React工具扩展会显著影响React应用程序的性能。由于扩展的目的是提供React组件的实时视图,因此它会在页面更改时尝试更新其表示形式,在某些重大变化中,这会增加延迟


在我的例子中,我有一个大约650行的表,可以通过单击列标题进行排序。在没有打开“开发工具”窗格的情况下,所有的工作都非常顺利(页面在一秒钟内更新),但一旦我打开“开发工具”并切换到“反应”选项卡,整个选项卡(我的页面和开发工具窗格)在表格排序后,对点击保持3-4秒无响应。

您能将其缩小到一个或两个组件出现问题吗?您能在某个地方获得应用程序的实时副本以供我们测试吗?禁用所有Chrome扩展是否有任何效果?您是否将任何内容记录到控制台?当开发工具打开时,日志消息会减慢一切速度。