Javascript 反应+；使用componentShouldUpdate进行Redux性能优化

我有一个react/redux应用程序，它已经变得足够大，需要进行一些性能优化

大约有100个独特的组件通过websocket事件更新。当许多事件发生时（例如~5/秒），浏览器开始显著减速

大多数状态作为不可变的.js对象保存在redux存储中。整个存储将转换为普通JS对象，并作为道具通过组件树传递

问题是当一个字段更新时，整个树都会更新，我相信这是最有改进空间的地方

我的问题:

如果整个存储通过所有组件，是否有智能方法防止组件更新，或者我是否需要根据每个组件（及其子组件）实际使用的道具为每个组件定制

shouldComponentUpdate

方法？

您真的不想这样做。首先，据我所知，Immutable的

toJS（）

相当昂贵。如果你每次都为整个州这么做，那是没有用的

其次，立即调用

toJS（）

几乎浪费了使用Immutable.js类型的全部好处。在使用渲染函数之前，您确实希望将数据以不可变的包装形式保存下来，以便在

shouldComponentUpdate

中获得快速引用检查的好处

第三，完全自上而下的做法通常会导致大量不必要的重新渲染。如果您坚持对组件树中的几乎所有内容执行

shouldComponentUpdate

，您可以绕过这个问题，但这似乎太过分了

推荐的Redux模式是在组件树中的不同级别的多个组件上使用

connect（）

。这将在多个层面上简化所做的工作

你可能想通读我收集的一些文章。特别是，最近的幻灯片非常精彩

更新：

在Reactiflux的#Redux频道上，我与另一个Redux用户进行了一次很好的辩论，讨论了自顶向下与多连接的问题。我已经复制了那个讨论，并将它粘贴到一个要点中：

---

另外，昨天有一篇文章很方便地介绍了Immutable.js的

toJS（）

函数的过度使用。这篇文章写得很好。

谢谢你的建议。我已经跟踪到了一个套接字消息，该消息同时发送了多个redux操作。连接多个组件肯定是下一步！当然我仍然需要在自上而下与多个连接之间提取对话。我完成后会更新这个答案。