Should You Fetch Data via Suspense or useEffect()?
As you learned throughout this chapter, you can use Suspense
in conjunction with RSCs, Suspense
-enabled libraries, or the use()
Hook (which also requires supporting libraries) to fetch data and show some fallback content while data is being fetched.
Alternatively, as covered in Chapter 11, Working with Complex State, you can also fetch data and manually show fallback content via useEffect()
and useState()
or useReducer()
. In that case, you essentially manage the state that determines whether to show some loading fallback content on your own; with Suspense
, React does that for you.
Consequently, it’s up to you which approach you prefer. Using Suspense
can save you quite a bit of code since you don’t need to manage these different state slices manually. Combined with frameworks like Next.js or libraries like TanStack Query, data fetching can therefore become significantly easier than when doing it manually via...