Тёмный

React Native Performance Optimisation (useMemo, useCallback, memo) 

notJust․dev
Подписаться 111 тыс.
Просмотров 49 тыс.
50% 1

In this video, we'll show you how to improve the performance of your application by employing three distinct techniques: useMemo, useCallback, and memo.
By the end of this video, we had increased our application's performance score by an insane +301,71%, so make sure to follow along to do the same for your app!
📚 Join the waitlist for "The Full-stack Mobile Developer" to be notified when we rerelease it:
academy.notjust.dev/
💬 Join the notJust Development gang and let's build together
/ discord
Tag me on social media when you finish this build, and I will give you feedback on your project.
➤ / vadimnotjustdev
➤ / vadimnotjustdev
➤ / vadimsavin
➤ / vadimnotjustdev
This video is not sponsored by anyone
Disclaimer: This build is for educational purposes only!! All views, opinions, technology choices expressed in this video are my own and do not represent the views, opinions, technology choices of any entity whatsoever with which I have been, am now, or will be affiliated.
#VadimSavin #notjustdev #reactnative

Наука

Опубликовано:

 

16 окт 2022

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 83   
@mateuszpusiewicz8851
@mateuszpusiewicz8851 Год назад
Amazing video! Tutorial on flipper would be great to see 🤩
@eduardocabrera9710
@eduardocabrera9710 6 месяцев назад
Thanks for the clearest explanation I have ever seen until now. Those examples were amazing, besides the demonstration convinced me to stop ignoring those react tools anymore.
@mounteverest4013
@mounteverest4013 Год назад
Thanks a lot for this. Apply this ASAP
@jahidunnurmaheeofficial2089
@jahidunnurmaheeofficial2089 10 месяцев назад
What a video! Last 2 weeks I was struggling with react native performance issue. I search in google and everywhere but finally I found a complete solution. Thanks dude!
@ashishmehra2661
@ashishmehra2661 Год назад
Serious stuff. Thanks for sharing.
@anazi
@anazi Год назад
Really good example and amazing explaination 👍👍 Much appreciated.
@stf8375
@stf8375 Год назад
Amazing and super well explained thanks !!!
@chetanbawankule8843
@chetanbawankule8843 Год назад
Thank you for this This is going to be very helpful
@ko_rizki
@ko_rizki 7 месяцев назад
that was a clear explanation, thanks, love it.
@carlosceronsantacruz6854
@carlosceronsantacruz6854 Год назад
Amazing video, Good job
@parthkolgiri7501
@parthkolgiri7501 6 месяцев назад
Some quality stuff mate!!
@minusmarigold98
@minusmarigold98 2 месяца назад
Wow , really thanks man i needed that a lot!
@notjustdev
@notjustdev 2 месяца назад
Glad it helped!
@comment-dev
@comment-dev Год назад
Good explanation to optimize rn 🤝
@HaiTran-tz7hm
@HaiTran-tz7hm Год назад
Thank u for the really good example bro 🤘
@manikantsharma6108
@manikantsharma6108 5 месяцев назад
Well understood, great video
@felipemelendez5741
@felipemelendez5741 Год назад
This was awesome, thanks!
@henrycovil2629
@henrycovil2629 8 месяцев назад
flipper plugin!!! Maybe it's still relevant for you
@WOW-fo8gx
@WOW-fo8gx 9 месяцев назад
Great video. Thanks a lot.
@calebcadainoo
@calebcadainoo Год назад
Interesting will explore the Flipper too 😉
@brainpowerofficial1207
@brainpowerofficial1207 Год назад
Amazing from my crew
@brainpowerofficial1207
@brainpowerofficial1207 Год назад
Vadim if you can make a booking app. We will be waiting
@lubwamaemmanuel7743
@lubwamaemmanuel7743 Месяц назад
Learn something beautiful for my react native projects. Kudos bruv
@notjustdev
@notjustdev Месяц назад
Glad you learned something new 🚀
@abazudosen
@abazudosen Год назад
well understood!
@abdallasuliman8165
@abdallasuliman8165 7 месяцев назад
Nice explanation and example, needs more clarification on useMemo vs useCallback.
@sykn3z
@sykn3z Год назад
Great example and thank You!!!! Can You please do it with more complex ítems. Using custom hooks, redux selectors and fetching data. It would be extremly helpful
@parthkolgiri7501
@parthkolgiri7501 6 месяцев назад
Yes please
@JanghyupLee
@JanghyupLee Год назад
Very easy to understand :)
@SahilSharma-ws1oz
@SahilSharma-ws1oz 4 месяца назад
Amazing thanks you ❤
@trendscene5374
@trendscene5374 Год назад
Mesmerizing
@ajagannath898
@ajagannath898 5 месяцев назад
Excellent explanation bro never show in pratical way in RU-vid ❤❤❤❤
@geohn8238
@geohn8238 3 месяца назад
Powerful video 👌🏼💪
@notjustdev
@notjustdev 3 месяца назад
Thank you 🙌
@jabbarahmad5095
@jabbarahmad5095 Год назад
Amazing
@sudharsan685
@sudharsan685 Год назад
Usefull video 👌
@VickysTuition
@VickysTuition 9 месяцев назад
Thank you 👍👍👍
@venkynavindla6795
@venkynavindla6795 9 месяцев назад
U R D BEST!
@amiribrahim01
@amiribrahim01 Год назад
Thank you
@abdelazizelmehammedy9376
@abdelazizelmehammedy9376 Год назад
Thanks for your good tutorial I have a request for you can you please make a react native app which uses the react-query along with AsyncStorage persistance to make offline mutations that resumes after going back online thanks in advance
@anazi
@anazi Год назад
We need an explanation on "rendered fewer hooks than expected" This is killing me.
@doniaelfouly4142
@doniaelfouly4142 Год назад
thanks
@rajkamalsingh2547
@rajkamalsingh2547 Год назад
Great, Is there any article where i integrate or use flipper into my react native app.
@FauziJabbar
@FauziJabbar Год назад
Coollll this's i find... mantap mas bruh
@jakubmuzik3296
@jakubmuzik3296 9 месяцев назад
Hello, would it be possible to wrap the flatlists renderitem in useCallback function instead of using the Reat.memo on the child component? Would it have the same result ?
@asqarpubgmobile
@asqarpubgmobile Год назад
Cool😎
@hascardenas
@hascardenas Год назад
Thanks for such a helpful video, I'd like to know if you are using Expo or React Native CLI on this video
@lukasgrinevicius5868
@lukasgrinevicius5868 Год назад
Thanks! We’re using React Native CLI here
@hascardenas
@hascardenas Год назад
Thanks Lukas, I’d really like a video about config Flipper with Expo, I haven’t found any clear tutorial about it. Just a suggestion heheh 😆 thanks for answering
@congdung7599
@congdung7599 Год назад
Can you do a video how to add RN Perf monitor in react native project?
@beingMeditative56
@beingMeditative56 8 месяцев назад
'We are trying to check if those objects are allocated in the same space in memory", I heard this at 7:18 sec in video. Same space in memory or same object in memory ?? Got confused here, please clarify.
@JkeyKong
@JkeyKong 6 месяцев назад
where to download the performance test tool in your video? I also want to test my react native performance like you
@areebchoudhary3785
@areebchoudhary3785 Месяц назад
Great work buddy, Love from Pakistan 💚🤍
@notjustdev
@notjustdev Месяц назад
Thank you!
@andrepadez
@andrepadez 11 месяцев назад
Awesome! What is the tool you're using to check performance?
@AnksioXD
@AnksioXD 8 месяцев назад
its called Flipper
@rohitbansal9183
@rohitbansal9183 10 месяцев назад
Performance montor is not showing in disabled section in the flipper... Anything I need to add from the code side.
@shadic7858
@shadic7858 8 месяцев назад
Memo also works when the component props includes an array?
@necmettinsargn3934
@necmettinsargn3934 Год назад
Last time I tried work with flipper but it was very hard to start it. Is it easy now?
@showbikshowmma3520
@showbikshowmma3520 Год назад
Is this valuable for large scale dynamic applications.
@rodelcrisosto499
@rodelcrisosto499 11 месяцев назад
can you please make a guide about flipper?
@touseefamjad416
@touseefamjad416 Год назад
Good sir can you please send me tha video link that define pagination in flast list because i see a large number of list is bad performance in flatlist
@sashomilenov2630
@sashomilenov2630 Год назад
Great example! Could you tell me the name of the app that you are using for performance check? thank you.
@bryanmehall2208
@bryanmehall2208 Год назад
flipper
@applicationdeveloper9057
@applicationdeveloper9057 Год назад
Hello i'm using same technique that you shwon still my logs appear every time on click can you help me ?
@ziahazara1250
@ziahazara1250 Год назад
What is the applications name by which you tested your applications performance? Can you please share it thanks 😃
@mariafailli5558
@mariafailli5558 Год назад
Flipper
@JKholmatov
@JKholmatov 11 месяцев назад
I am updating location state via watchposition, and a component that does not include location props is re-rendering anyway, what can be the reason?
@stan_de
@stan_de 11 месяцев назад
Is this a nested component? Then you should wrap it with memo and see Magic ;) When state changes - it will re-render component, hence it will also re-redender nested components as well.
@milon27
@milon27 8 месяцев назад
my react natiave app is showing that not able to use Rn perf monitor , why so?
@gouravnainwaya5669
@gouravnainwaya5669 Год назад
please make a file transfer app, a vpn app in react native without aws
@LanzRuizDesigns
@LanzRuizDesigns Год назад
hello may i know what platform you are using to test that react native app?
@LanzRuizDesigns
@LanzRuizDesigns Год назад
In the following question..do you have github for that demo?
@zksofficial-zh1gh
@zksofficial-zh1gh 9 месяцев назад
Need flipper tutorial
@wailynnoo3498
@wailynnoo3498 Месяц назад
May i know your debugging tools ?
@aidanwalker3058
@aidanwalker3058 7 месяцев назад
How do I install flipper on expo?
@nishantmogha7679
@nishantmogha7679 Год назад
Can you please just increase the font size its really hard to see.
@JokeryEU
@JokeryEU Год назад
why not use flashList ? instead of flatList
@notjustdev
@notjustdev Год назад
We have a separate video about FlashList, this one we wanted to keep focused on memo, useMemo and useCallback
@bilalrasool8696
@bilalrasool8696 6 месяцев назад
Can you assist me in determining which version of Flipper is suitable, considering that Flipper has been deprecated. Additionally, React Native Debugger is not functioning with Expo SDK 49, and I'm encountering challenges using Redux in Expo SDK 49.
@ThomazMartinez
@ThomazMartinez 10 месяцев назад
You dont need memo for this FFS dude, you just need to put that component where you have state changes in seperate component thats it, using memo stuff for everything it shows you have no clue what you doing
@alexfrozen
@alexfrozen 10 месяцев назад
I declined usage of absolutely all react hooks. Even useState. Only props for decompositions. The only one render at the start. There is a game changer, Reanimated. It's really possible.I've forgot all these re-render nightmare. And have got absolute magic of animations, transitions, swipes and so on. So I heavily recommend research Reanimated in depth instead of all these stuff in video.
@nandanithakur2172
@nandanithakur2172 Год назад
wow 🫀
Далее
FlatList is killing the performance of your app
10:04
The correct way to optimise React
11:29
Просмотров 28 тыс.
Чувака укусил зомби
00:13
Просмотров 226 тыс.
When you hit that level 6 right on time - ESL Dota 2
00:29
Mastering React Memo
26:56
Просмотров 131 тыс.
Building RAG at 5 different levels
24:25
Просмотров 9 тыс.
You Probably Shouldn't Use React.memo()
10:17
Просмотров 52 тыс.
Most overpowered way to build mobile apps?
8:33
Просмотров 693 тыс.
Stop Doing this as a React Developer
12:27
Просмотров 158 тыс.
ЭТО САМЫЙ ДОРОГОЙ IPAD!
1:00
Просмотров 430 тыс.