我的List
渲染了许多ListItems
(使用react-list
来减少页面上的数字)。
ListItems
具有可编辑的文本区域,可在每次按键时更新我的redux存储区的listItems
部分。
List
根据某些排序标准在ListItem
中获得mapStateToProps
个ID的数组。它会重复执行多次此操作,因为state.listItems
每次按键更新。
我尝试使用reselect来消除重复,但是考虑到state.listItems
是选择器的输入之一,由于每次按键都在变化,它实际上并未缓存。为了在每次按键时与之抗争,我现在通过所有ListItem进行映射并获取它们的ID(以及排序标准所需的其他一些东西),然后将其传递给执行deepEquals check的选择器,然后进行排序和缓存。>
这可以提高性能,但是在输入非常大的列表时仍然有些滞后。
问题在于,每个按键上的所有ListItems
仍在映射。
我唯一想到的解决方案是将ListItem
ID数组保留在商店中的其他位置,并且每次添加或删除ID时都必须保持最新。但这似乎很烦人,因为它实际上是衍生数据。或将我的textarea从商店中分离出来,使其成为不受控制的输入,以便它不那么频繁地更新商店。这并不理想,因为还有其他一些事情正在侦听那些需要在用户键入时更新的更改。
我还看到了一些其他类似的问题,涉及对对象数组使用重选,但是没有答案似乎有合适的解决方案。
有什么想法吗?