The first point is very important while working with optimizing both React and React Native. Not just reducing the re-renders but also lookin into if you can combine together or use useCallback and useMemo (don't overdo these things also) Another great and "smooth" video. Excited for this series.
Great info brother. There are some points i would like to add : 1. We can use RecyclerListView instead of Flat list. It would render the items fast. 2. We can create our own custom hooks or context api for using state over redux because redux can be a little heavy at times. 3. For checking re rendering over all components we can create our own hook using useRef and increasing the current ref value on each render and keep the updated count. 4. Enabling Hermes and using the V8 engine smoothes overall performance. 5. Making better use of useCallback and useMemo 6. Increasing heap memory size for android could be beneficial too. 7. Try never to pass {...props} to child components, it would be better to share the common global state instead of passing down props.
Great additional info, there's actually more to come in next episodes (about Hermes also). I hope people see your comment, thank you for taking the time to share these :)
This is it bois! The go to optimisation series 🥳🥳🥳 Have a lot of juniors in my team struggling with optimisations, going to share this to oblivion lol.
This is what i exactly needed.. Also it will be very helpful if you can make a dedicated video and explain how and when we should memorize the functions and components and also the pure components. I was working on an Instagram clone.. And day by day its becoming slow.sometimes Clicks respond after 2-3 seconds. I really couldn't understand what am i doing wrong. It has all the functionalities Instagram have.. Probably 60+ screens and 80+ components. Some of things got cleared today. I was not using redux. Not using memorization. Not using pure components. I'll work on these now. Thank you for this video ❤️
Wow, +60 screens is a lot indeed! Very happy this found you well. I'll see what I can do for a "memo" tutorial. There's just so much on my plate right now, it's hard to do it all! :)
Did you find something? Im also struggling with it, the onScroll from FlatList doesn't work so smoothly on android devices ): Im trying to make a sticky header too.
I also was struggling, the key is to create an animated value and use it inside scroll event to track when the user scrolls and bind it to the view you want to animate. On the animated style you play with the input/output range to get the sticky header
Yes, life sometimes. I do what I can but wish it could be more! I should make a live tomorrow, if you’re around and want to join. There’s also a video planned but it’s out of my control (I’ll talk about it too). Thanks for checking on me, it really means a lot (like really!)
Dude, never stop making content. You are Awesome.
Your way of explanation is so calming!
I’m very happy you liked it! I think it’s important to keep it simple and calm to learn things well. Glad it found you well Mukul :)
Always happy you do all the reading and give me the TLDR; ❤️
haha, it took me countless hours, lucky you!
Production quality of this content is top tier
Thank you, this was indeed a lot of work! Very happy you liked it :)
Great video. Not only you did a great job TLDRing the Callstack guide but also represented it so well. Kudos dude!
Thank you Luiz, I'm not used to see you on youtube! :)
@@eveningkid I'm around :) keep up with the good content man!
simple, concise and so well explained. It's always great seeing your content maintaining its amazing quality standard. Looking forward to more!
I see you're still around Usama, thank you for the kind words! Always trying to improve the videos. I'm glad it's appreciated :)
Thanks for sharing!
The first point is very important while working with optimizing both React and React Native. Not just reducing the re-renders but also lookin into if you can combine together or use useCallback and useMemo (don't overdo these things also)
Another great and "smooth" video. Excited for this series.
You're exactly right! Thanks, this one was a lot of work to keep it smooth. Happy you liked it :)
This material is so important, thanks for making a recap of the guide. I'm excited for more about optimization 🔥
what an amazing advice!, thanks man
Thank you
Underrated Channnel
Man I hope TH-cam could give me a little hand on this!
@@eveningkid gotta get a medium article or run some ads maybe
Really nice work..
Great info brother.
There are some points i would like to add :
1. We can use RecyclerListView instead of Flat list. It would render the items fast.
2. We can create our own custom hooks or context api for using state over redux because redux can be a little heavy at times.
3. For checking re rendering over all components we can create our own hook using useRef and increasing the current ref value on each render and keep the updated count.
4. Enabling Hermes and using the V8 engine smoothes overall performance.
5. Making better use of useCallback and useMemo
6. Increasing heap memory size for android could be beneficial too.
7. Try never to pass {...props} to child components, it would be better to share the common global state instead of passing down props.
Great additional info, there's actually more to come in next episodes (about Hermes also). I hope people see your comment, thank you for taking the time to share these :)
Just in time for the optimizations we are making in our app! Awesome!
Wow, that was unexpected! Cool, hope this helps you in a way :)
Excellent piece! And thank you for reminding me that I have to fix that constant re-rendering when I type anything in the TextImput... hehe
I think we often forget about the text input one! Thank you for the kind words, I always appreciate it :)
Great information. Thanks!
Thank you Simon :D
so awesome
Really helpful.
absolutely amazing!
Thank you Alexander! It says you've been on the channel for 3 months. Dang, that's awesome :)
This is so awesome. Great job!
Thank you Dan! :)
This is it bois! The go to optimisation series 🥳🥳🥳
Have a lot of juniors in my team struggling with optimisations, going to share this to oblivion lol.
Wow that's really cool Sanu! Are you in a big team of RN devs? :)
@@eveningkid hahaha depends on if you can call a team of 8-10 big 😇
Great work! Thanks for the video
Thank you Ramin, my pleasure :)
Amazing! 🔥
Thanks Nabeel :)
This is what i exactly needed.. Also it will be very helpful if you can make a dedicated video and explain how and when we should memorize the functions and components and also the pure components.
I was working on an Instagram clone..
And day by day its becoming slow.sometimes Clicks respond after 2-3 seconds. I really couldn't understand what am i doing wrong. It has all the functionalities Instagram have.. Probably 60+ screens and 80+ components.
Some of things got cleared today.
I was not using redux.
Not using memorization.
Not using pure components.
I'll work on these now.
Thank you for this video ❤️
Wow, +60 screens is a lot indeed! Very happy this found you well. I'll see what I can do for a "memo" tutorial. There's just so much on my plate right now, it's hard to do it all! :)
@@eveningkid i understand.. Although this video clears the picture alot. ❤️
Man, I'm struggling with sticky headers and scroll header animations, would love a tutorial on that.
Did you find something? Im also struggling with it, the onScroll from FlatList doesn't work so smoothly on android devices ): Im trying to make a sticky header too.
I also was struggling, the key is to create an animated value and use it inside scroll event to track when the user scrolls and bind it to the view you want to animate. On the animated style you play with the input/output range to get the sticky header
great content!!
Thank you Bayram, happy you liked it :)
what microphone are you using?
Did you guys play with play/pause button at 1:08?
...what do you mean? :D
Play with play/pause button at 1:08 in landscape mode
Tried using reanimated V2 today. I was using withSequence idk if its related but the more I trigger animation the more it gets slower
That's odd, you should reach out to the team/repo, I'm sure there's an explanation to this...!
@@eveningkid Found the problem. İt was my mistake 🙃
Please what app did you use for your video presentation
Do you think nativewind is good for react-native?
Can you provide an example of an uncontrolled component in React Native? onChangeText={() => { // updateRef } ?
Sure:
const [text, setText] = useState('jonas');
return ;
That's all :)
U will go very far man ...to the moon. 🌝
Thank you for the kind words DreadPool (nice name btw!) :)
always with great videos! thank you man! ... Let's talk about redux! :0
Thank you gonz! Redux? What exactly about Redux? 🤔
✌✌✌
:D
Please please make a video on Instagram reels🤐🤐😔❤️
What do you mean exactly? :)
Is everything cool bro? No new vids in a couple of weeks... Hope you're okay
Yes, life sometimes. I do what I can but wish it could be more! I should make a live tomorrow, if you’re around and want to join. There’s also a video planned but it’s out of my control (I’ll talk about it too). Thanks for checking on me, it really means a lot (like really!)
If ( thumbnail != Title ) {
Comment( "😑😑😑");
}
😑😑😑
😆
I love the video, but I hate zucchini!
haha, good thing it was only on-screen for 5 seconds then :)
@@eveningkid 😂