When to use Component or PureComponent
paul christophe
1.1K7

Thanks for the excellent article, Paul. You’ve motivated me to start incorporating shouldComponentUpdate best practices in to my React workflow.

You mentioned reselect as being helpful in managing changes in your derived data (AKA your selectors). Reselect essentially makes your selectors referentially immutable with respect to the props and state from which they are derived. That is, the references to your selectors do not change until you change the props or state that are used to calculate the selectors’ values.

Another excellent library to help with referential immutability is recompose, which is a collection of useful higher-order components (AKA HOCs) for React. HOCs are basically plain old functions that take a regular React component and return a new React component. In recompose, the returned React components are often just a modified version of the passed-in component (AKA base component). One useful HOC that recompose provides is called withHandlers, which creates referentially immutable functions that have access to the base component’s props. These functions’ references will not change until the base component’s props change.

There’s a lot more to recompose: that was just a taste! I highly recommend checking it out.