Already updated my projects. Pretty smooth transition, but the eslint isn't working in Vite, so I've got 8/9 and 32/34 components memoized, but can tell which ones are problematic. Using MUI, my component tree is a mess😭
Great video! How do you find out which components can't be compiled. The health check only tells the number of components compiled. Is there a way to see more details on which components didn't compile and the reason?
So basically it implements `React.memo`, `useMemo` and `useCallback` be default to any mutable elements making it not rerender brainlessly - shouldn't it be default React behaviour?
PSA: For anyone looking to get the eslint warning and errors, make sure you are using v8 without the flat-config. The react eslint plugins are not compatible with the flat config and v9.
Production: react 18 Beginner: React 19 is a bit better for you Remember that React 19 Suspense is slower than React 18, but shouldn't affect performance is your app, as you won't use it
Hey Kyle! I have been trying to solve this problem from long and hence seeking your help How do hide/remove the title and more videos sections from the RUclips embedded player in my app? tried the 's contentDocument and querying for its children but that didn't help.
I was once doing some serious debuing in my react-native app that used ContextApi and here is what I observed: -EACH component that uses 'useContext(myContext)` and even uses property that didn't change in the context will always rerender when any property of useContext changes -without using `useCallback` and `useMemo` on properties and functions served by the context, WHOLE context rerenders (and then all subsequent components that uses this context) on each local component state change (not from context). -so using `useCallback` and `useMemo` on arrays objects and funtions inside ContextApi dramatically lowers number of unnecessary rerenders but still on any property change inside context, all components using this context will rerender - redux fixes this issue. So ContextApi with memoizations is quite good, but definitely not ideal - or I am wrong.
We still can't even upgrade to 18 cause we have to upgrade all our unit tests from enzyme to RTL....that face when 100% unit test coverage causes migration issues
I loved the class-based components. they complicated the frontend development with the introduction of functional components with hooks. The thing use memo does to a react app. should have happened by default.
Wow. I thought I was mad when I thought they were cleaner. Glad I'm not the only one on the boat. I've always hated how dirty the code looks on function components. It's a mess. I'm having hard time trying to read this mess. On the other hand, classes were so cleaner and easier to read.
@@SteveosCPUmost of the time you don't have a choice due to IT guidelines, 1st or 3rd party dependencies, or simply. getting to work in ongoing projects made in React, so no.
Thank for the video, high quality content, as usual. But these features I see as huge overhead and completely pointless. JSX and all the React concept is an abstraction big enough. And this only builds more abstraction - taking away the real understanding of how things work under the hood - without providing any real benefits to the developer, as I see it here,
{ name }: { name: string } This is the part of Typescript I don't like. In the context of dynamic language we should take some liberties, especially in frontend code where the depth is complexity is usually not that great.
Could you please create videos based on large-scale projects?
if it memoizes everything by default then does it use extra memory as well?
Great to see u again! Kyle
Already updated my projects. Pretty smooth transition, but the eslint isn't working in Vite, so I've got 8/9 and 32/34 components memoized, but can tell which ones are problematic. Using MUI, my component tree is a mess😭
Back here again. Still can't use the eslint plugin :(
Thabks for sharing this info. It's always good to know React keeps evolving.
Great video! How do you find out which components can't be compiled. The health check only tells the number of components compiled. Is there a way to see more details on which components didn't compile and the reason?
I love this guy but I can’t unsee him shaking his head while talking. It‘s robbing me of my focus 😂
Why did you have to say that? now I keep seeing it as well
Shit can't unsee that now 😂
oh damn you're so right it's constant, I never noticed before
It's so distracting... I have to cover his face...
So basically it implements `React.memo`, `useMemo` and `useCallback` be default to any mutable elements making it not rerender brainlessly - shouldn't it be default React behaviour?
We should have this in like 2014
PSA: For anyone looking to get the eslint warning and errors, make sure you are using v8 without the flat-config. The react eslint plugins are not compatible with the flat config and v9.
Is it safe/good to use React 19 for production. Which one is better to learn now as a beginner React 19 or React 18?
Production: react 18
Beginner: React 19 is a bit better for you
Remember that React 19 Suspense is slower than React 18, but shouldn't affect performance is your app, as you won't use it
great video! thanks for sharing
Hey Kyle! I have been trying to solve this problem from long and hence seeking your help How do hide/remove the title and more videos sections from the RUclips embedded player in my app? tried the 's contentDocument and querying for its children but that didn't help.
If I am using the Context API, will this memo only trigger a re-render in the components that use the specific property that was updated?
I was once doing some serious debuing in my react-native app that used ContextApi and here is what I observed:
-EACH component that uses 'useContext(myContext)` and even uses property that didn't change in the context will always rerender when any property of useContext changes
-without using `useCallback` and `useMemo` on properties and functions served by the context, WHOLE context rerenders (and then all subsequent components that uses this context) on each local component state change (not from context).
-so using `useCallback` and `useMemo` on arrays objects and funtions inside ContextApi dramatically lowers number of unnecessary rerenders but still on any property change inside context, all components using this context will rerender - redux fixes this issue. So ContextApi with memoizations is quite good, but definitely not ideal - or I am wrong.
What kind of keyboard you use Kyle?
We still can't even upgrade to 18 cause we have to upgrade all our unit tests from enzyme to RTL....that face when 100% unit test coverage causes migration issues
That moment when you realize unit testing helps you catching bugs earlier, but takes extra time to maintain and introduce a new way of coupling.
bro really had to spend 1/3 of the video editing the config files just to write hello world 💀💀💀 react sure looks tempting I wanna learn this aha 😭
Hi, thanks for your awesome videos, is there a way to reach out to you for questions?
I loved the class-based components. they complicated the frontend development with the introduction of functional components with hooks.
The thing use memo does to a react app. should have happened by default.
Yeah class based component is more clean and just like desktop gui programming. And hook is crap
Wow. I thought I was mad when I thought they were cleaner.
Glad I'm not the only one on the boat.
I've always hated how dirty the code looks on function components. It's a mess. I'm having hard time trying to read this mess.
On the other hand, classes were so cleaner and easier to read.
@@youarethecssformyhtml yeah hooks especially useEffect is the source of bugs
Did anyone try React compiler for Existing Projects?plz share exact steps for migration
Useful 🎉
More titled Tuesday please!
So you stream somewhere? On twitch maybe?
❤️❤️🥺 awesome
I love React and I'm really exited for these new features to become stable
what do you love about React? I don't use it.
@@SteveosCPU try others frameworks, you'll realize React has the lowest learning curve
@@SteveosCPU try others frameworks, you'll realize React has the lowest learning curve
@@SteveosCPUmost of the time you don't have a choice due to IT guidelines, 1st or 3rd party dependencies, or simply. getting to work in ongoing projects made in React, so no.
How use effect not cause any issues, if you guys see there is no dependency array so it will under do infinite loop right?
Thank for the video, high quality content, as usual. But these features I see as huge overhead and completely pointless. JSX and all the React concept is an abstraction big enough. And this only builds more abstraction - taking away the real understanding of how things work under the hood - without providing any real benefits to the developer, as I see it here,
You can hide your camera or zoom out yourself
I am not ready for react 19 😅
please teach new nextjs 15 features and websocket connection with example
we would love to have a crush course on nest js from you. ❤❤
You won't imagine how fast your app will be when you stop using react at all! Start learning vanilla JS again!
Yea... Sometimes I do feel that... 😂
and reinvent the wheel!
jQuery write less do more
This comment is so stupid, no sane person would choose vanilla js to build a large scale app.
Atleast use Lit
Fun fact: Stream browser webapp uses jQuery. Like a lot.
This iust seems like too much work to upgrade. Im keeping with 18.
Shake it, but shake less
just scrap react for something that is fast out of box
React trying to be Svelte 🤣
No, its react implementing common functional features that has been around for decades.
{ name }: { name: string }
This is the part of Typescript I don't like. In the context of dynamic language we should take some liberties, especially in frontend code where the depth is complexity is usually not that great.
skill issue💀
bruh moment
Too bad the compiler is still in beta
stop using react :P Hopefully this helps I quit react after using react hooks for a while. they are so convoluted, cumbersome, and messy
U were prob using them wrong
Skill issue lol
React is PURE GARBAGE. Long live Svelte.
@@ba8e ok cultist
@@RevolutionaryUsername I'd say React people are cultists because they can't leave that piece of shit framework.
Third to view
This is great. Thanks🤭
I swear React is the laziest, most brainless implemented framework ever.
Can we make a federal ban on just adding “honestly” for no reason please.
13th comment...
first after firsts lol
Do not tell people what to do, you do not know what their circumstances and goals are!
dont come to see his videos then
He didn’t tell anyone what to do, he’s just showcasing a new feature. Tf are u on about?
I introduce you to a new concept: ignore them.
But you are telling him what to do
Or you can stop coding in React and use an Adult framework 😂
First comment
Thats no working on socket io connection
Also hooks(use, useoptimistics,use actions......) please