Why are the parameters newProps, newState? What is new about them?

    shouldComponentUpdate(newProps, newState) {

Why are these parameters “new” when they contain the same state as is in the Component?

shouldComponentUpdate runs when a component gets updated or is about to render again. Updates are defined by changes in the component’s props or state, but a call to shouldComponentUpdate can also come as the result of a parent component getting updated and then rendering its children, even if that parent is not changing the props to its children.

If shouldComponentUpdate is getting called and newProps and newState haven’t changed, then the update isn’t coming from this component, rather as a result the parent component is getting rendered (probably because its props or state changed) and is now rendering its children.

Generally, if your props or state don’t change, you don’t need the component to render. React provides a version of Component called PureComponent that automatically does this check - automatically providing an implementation for shouldComponentUpdate - and skips rendering of the component if this is the case.

class MyComponent extends PureComponent { 
  // ... does not render unless props or state changes ...
}

https://jsfiddle.net/ao7qh2u8/

1 Like

Thanks!!