Lesson 3.317mAdvanced4.4k students

Suspense for data loading

Suspense moves loading state out of the component and into its boundary, so you stop threading isLoading through the tree.

This lesson sits in Concurrent React, 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

  • Place boundaries where a meaningful fallback exists
  • Avoid a single boundary that blocks the whole page
  • Combine Suspense with error boundaries for failures

Pro tip

Put the boundary where a skeleton would make sense to a user, not wherever the fetch happens to live.

Resources