Lesson 1.3

Finding wasted renders

Most React slowness is a subtree re-rendering for no reason. Track it back to the prop or context value that changes identity on every render.

9mAdvanced6,653 students
Video thumbnail for Finding wasted renders

Sign in to watch this lesson

Browsing is free. Create an account to play videos and track your progress.

Overview

Most React slowness is a subtree re-rendering for no reason. Track it back to the prop or context value that changes identity on every render.

What this lesson covers

  • Trace a re-render back to the prop that changed
  • Spot object and function props recreated each render
  • Recognise context as a re-render broadcast

This lesson sits in Measuring Performance, part of React Performance Engineering. It assumes what came before it and leads directly into the next lesson in the module.

In this lesson you will:

  • Trace a re-render back to the prop that changed
  • Spot object and function props recreated each render
  • Recognise context as a re-render broadcast
Finding wasted renders — Skiply