A change to the way the Suspense tag works in React 19, intended to improve performance, will be reworked after community protests that the new behavior would make many existing applications slower. The team now says it will delay the release of the new version, currently at release candidate stage, until a fix is found.

The Suspense tag tells React to display fallback content until data within the tag has been fetched from the server. In prior versions, if there were several such fetches within the same Suspense element, React performed the fetches in parallel. 

In March 2023 though Andrew Clark from Vercel, also on the React Core team, merged a commit that changed this behavior. He explained the original rationale for parallel fetches but said that “the biggest issue with our existing implementation is that the prerendering of the siblings happens within the same render pass as the one that suspended — before the loading state appears. What we should do instead is immediately unwind the stack as soon as something suspends, to unblock the loading state.”

Clark added that at some future date, React may be able to implement a feature called resumable context stacks, which would allow parallel fetches to be re-enabled without the downsides. He said though that best practice is to move data fetches to server components or route loaders, which are alternative ways to get data from the server before rendering it on the page.

That pull request now has 190 downvotes and just 10 upvotes, the reason being that disabling parallel fetches within a Suspense boundary slows performance. “Please revert this change or at least make it opt-in if you think there are users who need to render their components as serially loaded waterfalls,” commented one developer. Another said, “this blocks one of the best React patterns – fetching the data in the places where it is used.” 

Most of the comments are recent, suggesting that few realized the impact of the change until it was highlighted. A key person in surfacing the issue was Dominik Dorfmeister, an engineer on the team for TanStack Query (formerly React Query), who tweeted about the change and said that “I haven’t seen anyone so far apart from the React core team who thinks this is the right tradeoff.”

The pushback had its intended effect. Dorfmeister discussed the feature with team members at a React Summit in Amsterdam; and a day later Sophie Alpert from the React core team recently said on X that “we plan to hold the 19.0 release until we find a good fix … more to come.” One suggested fix is that the behavior could be made opt-in.

According to Dorfmeister, the episode shows that “we need a better channel to communicate with the React team.” He said that he regrets “shouting at each other on Twitter” and praised the team for their calm response.

For some though, the controversy illustrates how React has morphed from a client framework to one that requires server components. “Up to this point React was THE library almost every webdev used to create great SPA [Single Page Application] client side only apps. If they continue to deviate from this, it’s just a matter of time until a new library gains popularity for those who don’t want to deal with all this SSR [Server Side Rendering] stuff,” said a dev on Reddit.

A new GitHub issue has been created to discuss what the fix should be.