我的商店中有一个包含多个对象的列表 (immutable.js)。 此列表在组件中显示为包含行的表格。这些行是显示单个对象的子组件。这些对象的一个属性应该是可编辑的。所以 onChange() 我派发了一个应该改变那个特定对象的属性的 Action 。因为我们永远不应该改变状态,所以我返回一个全新的列表,只改变了那个单一的对象。但是因为整个列表是一个新的列表对象,表格组件会在每次更改时更新。这会导致应用运行非常缓慢。
刚刚看了官方todo app example并使用 Perf 插件检查它。意识到他们还会在每次更改时重新呈现整个待办事项列表(标记为已完成,取消标记)。我应该如何解决这个问题?
最佳答案
影响列表渲染性能的最大因素是繁重的渲染周期和昂贵的 DOM 突变。确保您的列表项在重新呈现时尽可能高效。如果做得好,这将产生很大的不同。
您有几个直接的选择。
将您的行分解成它们自己的组件(如果尚未完成)并优化渲染和更新周期。
使用类似 react-virtualized 的库帮助列表/表格/网格性能。
关于javascript - React Redux 在单个对象属性更改时重新呈现整个列表,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38767455/