Three problems with this code:
SuspensefulUserProfileis not correctly utilizing the Suspense. We need to fetch data as we render, instead of first rendering and then fetching (through useEffect).UserProfilecomponent should be responsible for fetching the data instead ofSuspensefulUserProfile.- There is no fallback component. This will lead to a poor user experience.
Corrected:
import { Suspense, useState, useEffect } from 'react';