How React 19 Almost Broke The Web

As always, I am thankful to the React team for listening. This could have been bad. Suspense is complex, I'm happy it isn't about to break existing apps.

STARTING POINT (also follow tkdodo)

Core blog post

S/O Ph4seon3 for the awesome edit 🙏

[rafaelarantes]

mode: "parallel" | "waterfall"

[dstinYwOw]

>Open source project
>Discord
Every single damn time. Use discourse or something similar, don't hide behind discord walls.

[ReedoTV]

Imagine getting to upgrade to the current version of a framework 😱

[LuKaSSthEBosS]

wake up babe, another react leaky abstraction just dropped

[JeeGurda]

It's actually interesting how React team managed to miss on this, since there are select few libraries that are even able to work with Suspense. The fact that their tests didn't include react-query is pretty funny

[SeanCassiere]

From the library side of things, the fact that React does not ship its own typescript types bundled toghether during installation makes things so much harder. It makes it so that the installation/upgrades need to be orchestrated with the "overrides" field in the package.json (to match the types package) is something that makes it much more of a chore (especially making sure you have the right version of the types installed 😮‍💨).

I understand from the outside some may see it as "oh, you guys should know to do this..." or "common! it can't be that hard!". But given that we are already swamped, this extra burden is something that's most of the time just not worth the hassle.


Please ship your own typescript types!

[JTsek]

"Second Act: The Suspense Builds"

[BobKane-gx]

Wow.. so much stuff going on just to produce HTML. :)

[wlockuz]

Just an unopinionated javascript library. Nothing to see here.

[jackmcpickle]

Thanks for all your work on this @Theo - much appreciated.

[devagr]

Congrats to Phase on managing to get this chaotic recording into an actual video

[doc]

Nowadays,
I still use the old "{ loaded ? <Comp /> : <Loader /> }" to fully control all the data fetching behaviors. even naivest person in the team can understand what it does.
instead of guessing the "<Suspense fallback={<Loader />}><Comp /></Suspense>".

I know it's verbose, but serious question though: is there any speed, performance, render improvement, or edge case where <Suspense /> is good for?

I only care about performance improvement, hence if the <suspense> can bring a better UX to the end user. My own DX is less matter in this case.

[collinoly]

If you have a slow component shouldn’t you memoize it? Seems like we have a pattern to handle that situation already.

Also why not just create a second component. Keep suspense the same and create another version that blocks.

[mchisolm]

Thanks for covering this Theo and team for the great job editing it. Bummed I didn’t get to see the live stream, though. Thanks 😊

[Theepicfrenchguy]

Thanks for covering this topic, as a daily R3F user, it's terryfying.

[witchmorrow]

Thank you Theo and team, another super informative video! I would definitely appreciate a video all about Suspense itself

[codeChuck]

It is not ok for components to trigger a rerender of previous ones. Suspense should not waterwater, otherwise it is useless. They should keep fetching all at once, but find solution to do not rerender components with previously fired promises.

[lightning_]

I like comparing the React team's response to CrowdStrike's response. Both of them messed up, but one response was _significantly_ better!!

[gsgregory]

Two of the big issues that caused this seem to be that they failed to understand the use case, and did not note that the change was a breaking change to previous behavior. The response to feedback though is one of the best examples of properly handling things I've seen in awhile.

[ashbjorn]

When you announced the different acts, I couldn't help but hear the Law&Order "TUNNDUNN" sound in my head xD