Learn useMemo In 10 Minutes

[@franco-cespi]

These advanced Ract functions are really tricky to understand. You always come with concise videos that explains them really well. Thank you!

[@webwhale6026]

Agree 💯

[@tajpouria]

Best useMemo introduction video I seen so far, Please cover more hooks

[@elhaambasheerch7058]

The amount of clarity Kyle gives while explaining complex concepts is truly unmatched, certainly my go to channel to learn tough concepts.

[@tienlx91]

2 common use cases of useMemo: 1. When you want to make a slow function wrap inside useMemo so that doesn't re-compute every single time you render your component and it only computed when you acually need the value from that function since the inputs actually change 2. Whenever you want to make sure the reference of an object or an array is exactly the same as it was the last time you rendered if none of the internal workings changed, you're gonna want to useMemo here to make sure that you only update the reference of that object whenever the actual contents of the object change instead of updating every single time you render

[@kirankamath5891]

It is exactly same as Pure components in class

[@ayeshasarwar615]

@@kirankamath5891 isnt point can be achieved through useEffect() too?

[@DERICKBLACIDOCONTRERAS-c7f]

I found 3 cases: 1. Memoizing props to prevent wasted renders 2. Memoizing values to avoid expensive re-calculation on every render 3. Memoizing values that are used in dependency array of another hook

[@itsgojoverfr]

@@ayeshasarwar615 i had the same question but sadly you can't, the variable would be defined INSIDE the useEffect hook and we won't be able to access it outside of it due to scoping

[@daminipurohit6916]

First thing I do to learn a new tech is see if you have a video on it already so I can learn it fast and easily! Thank you very much for helping developers like me out there. Best wishes!! :)

[@girri]

This is the clearest explanation I have seen on this topic! Great work!

[@sahidulislamjony5769]

Memoization of object is huge learning for me. Thank you Kyel

[@haniamania5884]

Dziękujemy.

[@yitzchaksviridyuk932]

To be honest, after looking around youtube for some time, I was quite dissatisfied with the tutorials covering react hooks. I clicked on this video ready for another let down, but your video was great!! You cover topics clearly and concisely with a great balance between verbally explaining and showing your code. (I hope that made sense.) Gonna probably go through your whole hooks playlist now. Thanks a lot for the great video.

[@ionutsandu5913]

This guy is pure gold when it comes for web development tutorials. Luckily he matches my stack. Can't thank him enough. Keep doing this man :)

[@aryanshmahato]

It's really helpful.. please explain useCallback and other hooks please

[@bencodes]

Your explanation is so concise and well thought out. Thank you!

[@nareshbhati7527]

In every video, you will be taught new things, unlike other KZbinrs. Thank you so much for providing such amazing concepts for free.

[@dean6046]

Thank you Kyle! My girlfriend refers to you as the robot guy. You are some kind of Terminator robot sent here from the future to help us with all of our programming needs.

[@hugobqd]

You can notice that he blink at 5:21

[@dec2mclaren]

my wife agrees :'D

[@devolee8302]

lol

[@jaytran247]

Thanks very much for a great explanation. Recap: 9:49

[@Sandhyausa]

Truly commendable. As far as the videos i have seen, none of the youTuber explained this. Thank you so much for explaining meticulously. God bless you.

[@-anonim-3008]

Ohh, thank so much! I watched you video 3 month ago and didn't understand second case, but now you open my eyes! Thanks a lot!

[@ashwinsuryawanshi]

Being simple is not so simple and Kyle has mastered it.

[@Kim-by5uy]

Finally, a concise explanation of useMemo

[@serhiikhrapin5024]

5:49 In fact, useMemo is not called on every single render of the component. It only gets called when number changes.

[@koningguidokip]

I think useMemo get’s called every single time, but useMemo detects if the input has changed and decides if the callback function needs to be executed

[@dsuryas]

I just immediately fell in love with useMemo. I mean, wow!

[@julietonyekaoha402]

The sample code explains why and when useMemo is needed very well. Thank you Kyle.

[@Briefklammer1]

So why dont we use useEffect for the first example?

[@nitinkadam8588]

Key Differences - useMemo is used to memoize values. - useCallback is used to memoize functions. Usage: - Use useMemo when you have a computation that you want to avoid recalculating unless necessary. - Expensive calculations that don’t need to be recalculated every render. - Derived state that involves costly processing. - Large lists or data sets that require processing before rendering. - Passing objects or arrays as props to prevent unnecessary re-renders of child components. - Complex dependency arrays in hooks. - Use useCallback when you have a function that you want to avoid recreating unless necessary. Return Value: - useMemo returns the result of the computation. - useCallback returns the memoized function.

[@morphman86]

Excellent tutorial, as always. Completely unrelated, but that audio artefact around 7:44 almost had me throw my headphones away again. That exact sound is what my headphones usually make when they break. Because I got distracted, I decided to rewind a few seconds to hear what you said, and the artefact was there at the exact same spot. That's when I realized it was the video and not my headphones -_- Yeah, I go through a lot of headphones, about 8-10 pairs per year. Always the left one going first, for some reason...

[@ogat8909]

Nice to have Kyle in the world of internet, you're my ideal dev!

[@JuanDGoPro]

Finally!, I understand this useMemo function, thanks

[@ViktorHugo-je6rq]

Thanks Kyle for explanation. Separate thanks for your clear english. It's easy to hear and to understand each word you say.

[@陽楊-o3l]

The most simplest video but easiest understand about hooks ,Thank you so much for you sir~

[@mostinho7]

Todo: 2:50 why does react seem to detect change in double number variable even though it’s not state? It doesn’t, but when the state changes the react component is re-rendered which means all the code inside our functional component runs again, so slow function is executed

[@MolinRJ]

that second application example was really mindBlowing. Thanks.

[@karim6179]

i literally been searching in udemy for a course that explain react hooks like this saw couple of videos but none of theme get to that great content quality feels guilty to get that for free thanks man

[@ThomasPGeorgeCSB-]

This was the best example to understand useMemo. Thanks a lot!

[@RejetiMeghaVardhan]

Thank you Kyle! for giving such clarity in explanation

[@jovantancevski7629]

Best UseMemo video I've seen so far, good job Kyle !

[@xWildStorm7x]

Thanks for the video! Best useMemo tutorial I've seen. And that second use you explained at the end for useEffect with objects and arrays in the dependencies is awesome. I didn't know how to handle those cases.

[@suryaprakashm1886]

Sucha an amazin explanation dude !!! Was trying to wrap my head around the memo hook ... your explanation was spot on .

[@shadmanmartinpiyal4057]

just decided to increment my knowledge of react with this react hooks playlilst during the weekend. Rock on!

[@roadsideromeo9215]

You killed it man, that's awesome. You make my concept clear. Thanks buddy.

[@romko-romario]

Just a brilliant explanation, lots of thanks! My mentor told me to learn memoization, and after just 10 minutes of this video, I understood what it's for and how to use it.

[@fbiindia9661]

you are a legend Sir! going through a Meta certified frontend course and they did a pretty bad job at explaining memo, I already knew where I have to come to understand it better and I was correct.

[@wittyhumour29]

Fantastic tutorial Kyle. Your explanation is precise, on point, and understandable. Your series about React-Hooks is one of the best on KZbin.

[@devDive615]

oooh that was the best explanation i've seen so far

[@yassineaker]

You are absolutely a legend. Your examples are very concise and clear.

[@anuragk6722]

By far the best explanation

[@billwu7367]

you are a skillful and smart ,patient youngster

[@tomino133]

Dude I stumbled upon your channel again and it is a gold mine. Thank you!

[@jessejburton]

Super helpful! One of the best descriptions of useMemo I have seen. Thanks :)

[@sangdilbiswal30]

bro your explanations are insane

[@АлексейСтепанов-к9о]

Thanks for the great explanation. Now for my the useMemo march clear than before.

[@sologuitardeshchatterjee]

Best useMemo explanation so far... Was longing for it... Thaks Kyle! :)

[@lpaddikt]

Amazing video, always can count on your videos being succinct and informative. Thanks man.

[@darynadatsenko3266]

I am in love with this guy! thank you for explanations :)

[@LEGnewTube]

Clear as crystal. Thank you for the vid!

[@parrot785]

I like your videos very much, because they are short and you manage to explain things in a simple way. Thank you!

[@yatrikamrutiya9376]

Amazing man!! loved your explanation!!

[@ekwan16]

Extremely clear explanation!

[@cervece41]

Awesome stuff as usual Kyle, I'd love to see an useCallback tut, thanks!

[@dixztube]

Great job I need to use this solution. Folks I’d say this stuff is easier to learn once you learn the basics of how memory works. And ref vs value and component lifecycle. It’ll make this make way more sense

[@RohithVarma36]

Best Practical cases are covered, awesome.

[@gourabpaul3560]

I love you man, this is so easy to understand.

[@MarcoS-bx5uk]

Great. Examples are simple and explanation goes straight to the point.

[@yushsingla9905]

God level explanation, I am glad I clicked this video!!

[@naveenkumar-vb8tp]

Amazing explanation🙌, have never seen like this before. thank you

[@dimitargetsov9690]

Sir Kyle, Friends, useMemo(()=>()=>()=>()=>someresult) works! If i am not wrong , useMemo executes not only the function passed to it ,but continues and executes the nested in function, nested in function, nested in function...function.

[@briancasady6182]

This was exactly what i was looking for, thanks!

[@jakexz4251]

bro you are a god, you just save me thank you so much

[@freak2137]

cant wait to implement this trick on my project! Great tutorial!

[@udaychandra7663]

Thank you for your clean explanation and it helps me a lot!

[@yinonelbaz5309]

Amazing explanation!! Thank you so much for the channel and the hard work you put into it, I really appreciate it!!!

[@nazarpasha]

easy explanation thanks bro👍

[@ZehnGen]

Thanks a lot for this simple explanation with an example, helped me understand some use cases a lot more.

[@tinnguyenvan9925]

Thank you . This video help me understandings about useMemo

[@talkwithshiva8941]

you explained with so much ease best video

[@mhdfirassbarakat6587]

keep in mind that my entire career depends on your videos 😂😂😂😂 so keep up the great work 💙💙

[@phantom7132]

The object-example was a good one!

[@hayveno]

Well explained, Kudos Kyle.

[@erfanm1206]

wow man you explain very well my mother tongue is not english but even thuogh i understand it perfectly you are amazing Thank You

[@davidgentilli7944]

Simple and clear explanation! Thank you

[@shakdaniel]

Very good explanation! great video man, keep it up! 🦾

[@taufikdev]

Thank you Kyle ! 10 minutes which makes me understand :)

[@TechnoDB]

Simple and Clean Background.. Nice ))

[@anthonysim563]

This was an excellent explanation! Thank you!

[@SOUVIK_RAY_]

Amazing explanation! Great video!

[@alvarocastillocorrea2610]

Thanks for simplifying the web man!.

[@aashayamballi]

Thanks Kyle... You're awesome!

[@ngocminhle9127]

Very clear, very helpful. Thanks a lot :).

[@tadeuszjiwu255]

Amazing explanation !!! Well done, thank you very much

[@omarshahid5094]

Thanks for this awesome tutorial. I have a confusion, can't we receive the same thing with useEffect with dependency of the number?

[@TheAssasinsBreed]

i think useEffect runs when mounts and updates unlike useMemo which runs only during updates? i might be wrong tho :)

[@orennkimg6851]

i have the same question .... someone??

[@0xSLN]

A big difference: Memoization (useMemo) caches the result of the function based on the parameters (dependencies) received, to prevent expensive function calculations.

[@thanglenho828]

very easy to understand, thank you very much

[@abdulmuneebafridi4437]

Appreciate your effort , well thanks for providing effective content

[@barman498]

Thanks for the great explanation. Really helpful ❤️

[@akhilnegi100]

As soon as I start video, first I would do like the video and than start watching it, so as not to miss liking it later.

[@aravindmnair_]

Man, you deserve more subs! big thumbs up

[@arunroy9812]

thank you for the concise explanation! great help. cheers!

[@tambolaking5383]

This content is awesome. Need more such performance improving ideas

[@kaylemaclou]

Well explained, Kyle!

[@nikhil6842]

Great Tutorial Kyle

[@lukeh8392]

Your videos are spot on thanks dude

[@gabrielaugustodevitodabbad6822]

Amazing explanation, thanks

[@vnoommuy]

WTF Kyle you're always coming up with videos talking about topics I need to learn. You wizard!