Sign in Go Pro

Advanced React Native

Fixing Performance Issues with PureComponent

This lesson is for PRO members.

Upgrade today to get access to all the PRO lessons.

Unlock this lesson

Up next



Re-rendering too many components too often can cause performance problems, so it's important to not re-render components that don't need to update - even if their parent re-renders.

React has a PureComponent that we can use to perform a shallow equality check on props and state, which can help with this issue - and prevent unnecessary re-renders.

Summary of Content:

  • Force the TodoList component to rerender every 500ms by changing a new counter in state
  • Create a new PerfTest component, and log every time that component renders
  • Switch PerfTest from React.Component to React.PureComponent to take advantage of the PureComponent shallow equality check on props, and to stop the unnecessary renders




There are no comments on this lesson, start the conversation below ...

You need to go PRO to post comments.

Lessons in Advanced React Native