防止子组件在redux状态更改时重新呈现

Question

我的根应用程序组件中有一些方法可以跟踪用户在页面上的位置。 一个跟踪滚动位置，通过在用户滚动时保存redux存储中的值（因此它在滚动时不断更新redux存储），以及其他跟踪用户光标所在屏幕的象限（也在更改时更新存储）。 这一切都发生在App组件中。 因此，为了防止不必要的重新渲染，我实现了shouldComponentUpdate来比较值并返回false。 这对于App组件本身很有用，但是子组件仍然会在这些更改上重新呈现。

子组件不访问此特定状态部分，但尽管如此，它仍会重新呈现。 所以我假设connect()正在发生一些事情。

我已经尝试设置connect(mapStateToProps, null, null, {pure: true})的选项connect(mapStateToProps, null, null, {pure: true}) ，但这并没有改变任何东西。

这是我的App组件中跟踪滚动的方法：

  handleScroll = () => {
    const { dispatch, scrollTop: stateScrollTop } = this.props;
    let scrollDirection = 'bottom';
    const scrollTop = window.pageYOffset;
    if (stateScrollTop > scrollTop) {
      scrollDirection = 'top';
    }
    dispatch(windowScroll(scrollTop, scrollDirection));
  };

如果每次这些值在商店中发生变化时，我都可以让子组件停止渲染，那么我的应用程序总体上会提供相当大的性能提升。 将不胜感激任何帮助！