This is actually a good change. We are seeing a literal 1 second delay in skeletons showing due to expensive rendering passes down the tree. React better release their component to fix this though.
Im not a JS dev but im confused by the logic applied from react devs. WHY would you change the default behavior of a functionality if there are other options or rather it should be the developer that fixes the issue. If you have an expensive component why not make it also be self suspending that would eliminate the need to throw away the first render. Or if that is not possible than why not add an "attribute" to Suspense defining how it handles its children. for example default is "parallel" if you need to you set it to "sequential".
because it is not changing any default behavior. Suspense is going to be release in full with React 19 only. The behavior that these lib authors used was still beta. If you didn't notice only lib authors are complaining about this, because they went ahead and used React's internal/beta features.
Suspense is actually great, though. If you're currently not using suspense in situations you could benefit from, that means you're effectively waiting for everything to load before showing anything to the user which is worse than even the react 19 version of suspense.
Yes i do believe react 18 and next 14 are very stable and great for building complex applications by adding other packages to it like redux or zustand. React 19 has only one thing i liked which is a compiler which i thought would be similar to svelte compiler where it will push a compiled javascript to production and react will only be used as a dev dependency which will reduce the production bundle size. However, that is not the case instead we have some new hooks like useOptimistic, useTransition which is uncessarily trying to handle things automatically which developers used to manage themselves and i really dont like that. So i will only upvote react 19 for the react compiler but sadly it is nothing great in comparison to the svelte compiler because it still pushes react in production right and does not reduce the production bundle size like svelte does.
"Still recommend preloading but recognize it's not always practical" What do they mean by that? Sure you can preload initial data serverside but if the component is dynamic with dynamic data (like what most of react is used for) you need parallel fetching. I have no idea what they were thinking with this. Am I just missing something?
Dude, they literally call SPA approach a "legacy mindset of building FE apps". Going all-in for the Backend-centric rendering. Now we're expected to clean freaking browser cache from the server... The proclaimed benefit is "performance" but IMO it's more about control over ecosystem than anything else.
@@IvanKleshnin I'd get it if this was ruby on rails or laravel + livewire where serverside rendering is integrated properly, but they expect us to do that in NextJS ? Yeah no, that's crazy. The whole point of react is client side responsiveness, if they take that away might as well use HTMX+backend of choice and call it a day.
@@andrewdrone yep, just today we've got another controversy. This time it's React-19 being 6x slower than React-18 on some SPA example. The release is suspended and they apologize like "We forgot that many people still use SPA and other legacy tech. But don't worry, we'll fix your problem". So, assumingly, it's a shame and a problem that some people use SPA and don't buy into new shiny NextJS approach @_@ I agree with all your points btw 🤝
Very curious to see what the solution to this is since they’ve walked back. Seems they liked this feature at Facebook and it helped them. Easiest way would seemingly be a prop for the method, parallel or waterfall on each Suspense. Default it to parallel.
Hey Josh. very basic question :D. What keyboard and mouse you are using? im currently looking for a "good" keyboard for programming and personally i dont like the 100% keyboards
Great vid mate! Sure it's good they listened... But why did they make such a breaking change without feedback in the first place? JS land is embarrassing at times.
@@gcash49 What qualifies to be objectively better? perfs? bundle size? reactivity? maintainability ? DX? cause react is behind in most of these aspects. But definitely react has a very huge community and a lot of loyalists.
I really don't want to criticize your video. However, I believe that those who find this a breaking change are not truly familiar with the framework and are just following trends. For instance, the definition of Suspense in the initial React 16 (now React Legacy) was: ```React.Suspense lets you specify the loading indicator in case some components in the tree below it are not yet ready to render. In the future, we plan to let Suspense handle more scenarios such as data fetching.``` If developers now have unoptimized code that wraps multiple different queries to multiple APIs, what do you expect? Just duplicate your React.Suspense for each component.
No nooooo , i try it before , its awesome but has less community packages / libraries and the support of typescript in svelte components is weird Thats it everything else is good
@@gamingwolf3385 I believe Svelte 5 solved the inability to use TS outside . Generally, yes, Svelte has a smaller community, but I find shadcn-svelte works great, and TS/JS libraries work without a framework-specific wrapper. I far prefer it to React
@@statuschannel8572 exactly. Honestly I think it’s great that we as a community have a voice and we can prevent stuff like this from coming out and they actually want to listen to us
@@marcuss.abildskov7175 lol only from react 19 there is a compiler and it's magic. so by your logic everyone who uses a library or framework don't know anything about software engineering. Tell me you're a blind hater without telling me you're a blind hater moment!
This is why they have release candidates. People test it out and find issues like these. Hope it gets sorted.
Na, this is why you have words. You use those words to talk to people before making sweeping changes like this.
@@drewhjava wo...wor.....ds?
This is actually a good change.
We are seeing a literal 1 second delay in skeletons showing due to expensive rendering passes down the tree.
React better release their component to fix this though.
Im not a JS dev but im confused by the logic applied from react devs. WHY would you change the default behavior of a functionality if there are other options or rather it should be the developer that fixes the issue. If you have an expensive component why not make it also be self suspending that would eliminate the need to throw away the first render. Or if that is not possible than why not add an "attribute" to Suspense defining how it handles its children. for example default is "parallel" if you need to you set it to "sequential".
This feels like classic React. Create a problem then discuss solutions.
It'd classic React. Fix problems by causing more problems.
because it is not changing any default behavior. Suspense is going to be release in full with React 19 only. The behavior that these lib authors used was still beta. If you didn't notice only lib authors are complaining about this, because they went ahead and used React's internal/beta features.
Bro our community engineers just to engineer. Like we need to solve important problems, not make problems to be solved like a jimmy neutron episode
So much for an "unopinionated" JavaScript "library". React is a damn circus.
Fortunately, I haven't used suspense and don't have plans to use in future 🙂
You definitely should use it but certainly not in react 19 for now.
How do you do partial rendering/streaming?
Suspense is actually great, though. If you're currently not using suspense in situations you could benefit from, that means you're effectively waiting for everything to load before showing anything to the user which is worse than even the react 19 version of suspense.
So looks like I’m staying on React 18/NextJS 14 for the foreseeable future
Yes i do believe react 18 and next 14 are very stable and great for building complex applications by adding other packages to it like redux or zustand. React 19 has only one thing i liked which is a compiler which i thought would be similar to svelte compiler where it will push a compiled javascript to production and react will only be used as a dev dependency which will reduce the production bundle size. However, that is not the case instead we have some new hooks like useOptimistic, useTransition which is uncessarily trying to handle things automatically which developers used to manage themselves and i really dont like that. So i will only upvote react 19 for the react compiler but sadly it is nothing great in comparison to the svelte compiler because it still pushes react in production right and does not reduce the production bundle size like svelte does.
"Still recommend preloading but recognize it's not always practical" What do they mean by that? Sure you can preload initial data serverside but if the component is dynamic with dynamic data (like what most of react is used for) you need parallel fetching. I have no idea what they were thinking with this. Am I just missing something?
Dude, they literally call SPA approach a "legacy mindset of building FE apps". Going all-in for the Backend-centric rendering. Now we're expected to clean freaking browser cache from the server... The proclaimed benefit is "performance" but IMO it's more about control over ecosystem than anything else.
Lol. So they're saying Google Maps is built on a legacy mindset? That's rich...
@@IvanKleshnin I'd get it if this was ruby on rails or laravel + livewire where serverside rendering is integrated properly, but they expect us to do that in NextJS ? Yeah no, that's crazy. The whole point of react is client side responsiveness, if they take that away might as well use HTMX+backend of choice and call it a day.
@@andrewdrone yep, just today we've got another controversy. This time it's React-19 being 6x slower than React-18 on some SPA example. The release is suspended and they apologize like "We forgot that many people still use SPA and other legacy tech. But don't worry, we'll fix your problem". So, assumingly, it's a shame and a problem that some people use SPA and don't buy into new shiny NextJS approach @_@ I agree with all your points btw 🤝
"Pretty fast, in the tradition of react" - I wouldn't really remember React for its speed :)
Very curious to see what the solution to this is since they’ve walked back. Seems they liked this feature at Facebook and it helped them.
Easiest way would seemingly be a prop for the method, parallel or waterfall on each Suspense. Default it to parallel.
Only react has these problems
React is THE problem.
Hey Josh. very basic question :D. What keyboard and mouse you are using? im currently looking for a "good" keyboard for programming and personally i dont like the 100% keyboards
Looks like React 19 is trying out the new "slow and steady wins the race" strategy-except it's losing😆
its problem is that its a cyptic shit that shouldnt be used anywhere
Does this only apply to client components? Or also RSC with suspense?
only client components, RSCs still fetch in parallel
has this issue been resolved?
what coding font you are using josh.... its looking so clean , thanks
Great vid mate!
Sure it's good they listened... But why did they make such a breaking change without feedback in the first place?
JS land is embarrassing at times.
React is a problem
🤣
😆✅
Js is problem.
And I love it! ❤
Use something else
Javascript is a problem
Just add a prop to enable sequential rendering. This is where partial pre rendering will come in handy.
Glad we decided to move away from react. Tired of these insane changes. All these 'fixes' and its still significantly compared to Solid, Vue, Svelte.
Great vid! I noticed "disk cache" on the first example, doesn't that mean they are returned form the browser cache?
Only react would release a ‘mandatory waterfall feature’…
vue or svelte is the way. we need to jquery react.
never.
Exactly Vue, Svelte or Solidjs are much much better.
none of those are big enough improvements to react objectively
@@gcash49 What qualifies to be objectively better? perfs? bundle size? reactivity? maintainability ? DX? cause react is behind in most of these aspects. But definitely react has a very huge community and a lot of loyalists.
Angular
Now let's fix the compiler and then introduce some bugs in react 21
const [solution, setSolution] = useVue()
setSolution(new ReactCompiler())
React is the new jQuery
I really don't want to criticize your video. However, I believe that those who find this a breaking change are not truly familiar with the framework and are just following trends. For instance, the definition of Suspense in the initial React 16 (now React Legacy) was:
```React.Suspense lets you specify the loading indicator in case some components in the tree below it are not yet ready to render. In the future, we plan to let Suspense handle more scenarios such as data fetching.```
If developers now have unoptimized code that wraps multiple different queries to multiple APIs, what do you expect? Just duplicate your React.Suspense for each component.
codesandbox.io/p/sandbox/react19-forked-fgxk7h
Here's a codesandbox:
sandbox/react19-forked-fgxk7h
nice. from slow to slower.
I use suspense alot, i think it will slow most of the people that use it.
I think it should be a prop in the Suspense component, somthin flike
“listening to our problem” 😹
i mean they created the problem
what extention browser you use????
Arc
I somehow feel @josh needs to post every week 🤔 Good real world content out there!
svelte 5 in this time 👀
No nooooo , i try it before , its awesome but has less community packages / libraries and the support of typescript in svelte components is weird
Thats it everything else is good
They have all you need nowadays even shadcn
@@gamingwolf3385you are way too outdated on svelte 😂 Svelte 5 supports TS everywhere with no problems
@@gamingwolf3385 You don't need a svelte specific library/package. If it works on standard sites it works on svelte.
@@gamingwolf3385 I believe Svelte 5 solved the inability to use TS outside . Generally, yes, Svelte has a smaller community, but I find shadcn-svelte works great, and TS/JS libraries work without a framework-specific wrapper. I far prefer it to React
That is why I prefer Nuxt (Vue)
One may argue that suspense was abused here and you might want to suspend the the components with the individual calls
Thinking about it, you might want to use Suspense in this way to ensure everything is loaded (i.e., no loading spinners)
3s is fast? Bro, real programmers measure in micro or milli seconds.
No 😂
A slug is fast if you compare it to a sloth, fwiw
Everyone whining about react. Just use something else. Oh wait, there isn’t a single job in svelte or whatever other libraries you prefer.
lol agree, why complaining about a release candidate? the whole purpose of them releasing the candidate is to get feedbacks like this!
@@statuschannel8572 exactly. Honestly I think it’s great that we as a community have a voice and we can prevent stuff like this from coming out and they actually want to listen to us
Tell me you're a web developer without telling me you're a web developer.
React is for people who don't know anything about software engineering
@@marcuss.abildskov7175 React is for people who aren't broke, like you.
@@marcuss.abildskov7175 lol only from react 19 there is a compiler and it's magic. so by your logic everyone who uses a library or framework don't know anything about software engineering.
Tell me you're a blind hater without telling me you're a blind hater moment!
Hi Josh. Programmierst du uns eine Schach-Website?
What i saw in the thumbnail was a corny looking smile.
React (facebook) is like Adobe, need to switch away from
it is all about marketing
Solid JS is the future
Svelte 5 FTW
Doesn't impact me .. interesting though
Thank you so much
NextJs should have been built on Go nd htmx or something 🗣️ instead of React nd Js
Gonna stick with React 18 till 2026...😂
0:19 feels gay
just move to angular
It's 2024, stop using react..
Why? Doesn't make sense.
so irrelevant but i have a crush on u now
Ta-da that's why React is inferior
Stop using react
React18+Next14
Love from Bangladesh ❤️❤️
yo!
thank you bro, it's very amazing
Yay