数据爆发,redux 缓冲/react重新渲染

IT技术 reactjs redux
2021-05-20 04:05:43

这是我的数据流:

1:500 多个物体在 1-2 秒内通过插槽

2:对象直接添加到redux store

3:React 表容器连接到 redux 存储(使用它作为数据源)并为每个对象重新渲染。

这么多重新渲染几乎杀死了浏览器。

我有什么选项可以缓冲传入的对象(事件)并每隔 1 秒将批次发送到减速器?更好的解决方案是以某种方式限制react渲染(shouldComponentUpdate...),但我怀疑这可能吗?

3个回答

我建议专门研究 RxJS 和redux-observable如果我没记错的话,您正在寻找的是debounce操作员

RxJS 的学习曲线非常陡峭,但我已经设法很快建立了一个基本的工作解决方案。

我受到了这次演讲的启发,我鼓励你听一听。

您可以在减速器中使用临时缓存作为本地数据。可能在将数据添加到存储对象之前超时。

您可以使用 shouldComponentUpdate 中的 setTimeout 来实现自己的节流行为,或者使用像https://github.com/ryo33/react-throttle-render这样的准备好的东西