简体   繁体   English

在React的shouldComponentUpdate中比较对象数组是否有意义?

[英]Does it make sense to compare arrays of objects in React's shouldComponentUpdate?

I am experimenting with React and I was trying to optimize Components update, etc. 我正在尝试React,并且正在尝试优化组件更新等。

I'm building a search component that returns an array of objects. 我正在构建一个返回对象数组的搜索组件。 To optimize it I was trying to prevent my component from updating if the search results are the same after performing a new search. 为了进行优化,如果尝试执行新搜索后搜索结果相同,我试图阻止组件更新。

Right now I'm using Immutable to compare them and it works. 现在,我正在使用Immutable进行比较,并且可以正常工作。

Any comments about the performance side of this? 关于性能方面有何评论? Does it make sense to do it in general? 一般而言,这样做有意义吗? Any more efficient ways to do it? 还有更有效的方法吗?

This is my component. 这是我的组件。

class ItemsListContainer extends React.Component {

  componentDidMount() {
    itemsApi.getItems();
    store.dispatch(loadSearchLayout('items', 'found items'));
  }

  shouldComponentUpdate(nextProps, nextState) {
    let prevItems = Immutable.fromJS(this.props.items);
    let nextItems = Immutable.fromJS(nextProps.items);
    return !Immutable.is(prevItems, nextItems)
  }

  render() {
    return (
      <ItemsList items={this.props.items} />
    );
  }

};

const mapStateToProps = function(store) {
  return {
    items: store.itemsState.items
  };
};

export default connect(mapStateToProps)(ItemsListContainer);

I would leave this as a comment if I had the points necessary to do so. 如果有必要的话,我将在此留个评论。

See Performance issues with a tree structure and shouldComponentUpdate in React / Redux 在React / Redux中查看树结构和应有的组件性能问题

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM