Performance Optimization | Core Web Vitals | React

Hey everyone, In this video we will be learning about performance optimization.
We will talk about the core web vitals like -
1. First Contentful Paint
2. Time to Interactive
3. Speed Index
4. Total Blocking Time
5. Largest Contentful Paint
6. Cumulative Layout Shift, and performance optimization tools like -
1. pagespeed.web.dev/
2. gtmetrix.com/
3. Lighthouse and,
4, Performance Insights
Do watch this video till end.
If this video was helpful, give it a thumbs up and subscribe to my channel for more such videos. 🔔
Subscribe here - / devchannelbyakashingole
Other Video links (Shopping Cart)-
Part 1 -
• Shopping cart tutorial...
Part 2 -
• Shopping Cart Project ...
Part 3 -
• Shopping Cart Tutorial...
Part 4 -
• Shopping Cart Tutorial...
Part 5 -
• Shopping Cart Tutorial...
Part 6 -
• Shopping Cart Tutorial...
Part 7 -
• Shopping Cart Tutorial...
Part 8 (Deploy to Firebase)-
• Shopping Cart Tutorial...
#react #performance #optimization #firebase

[@arihantjain8347]

No one would watch this video or appreciate it till they themselves are stuck with the performance, I have learned a lot, thanks Bhai!

[@akashingole]

Thanks bhai....means a lot

[@enjoyenjoy6527]

@@akashingole thanks for the video, I have a problem. The fact is that my photo content is in src. I need to load the preload img in the header component and I don’t understand how to specify the path where to store the img. I did the preload as in the video, but it does not affect the loading page speed((

[@gautamsahani7604]

Exactly like me 😔😔
Appreciated it's helpful explanation

[@akashingole]

Thank you for watching 😊
Don't forget to like, share and subscribe 🙌
-AI

[@vinitagarwal2107]

Great video Akash!
Additional things which can be done -
- Image lazy loading
- Using gzip/brotli compression, use broti instead.
- Multiple chunk load (already mentioned at the end)

[@rlxgroot278]

apki sari video dekhi he bhut sikha he please upload krte rehna

[@akashingole]

Thanks yr, it means a lot 🙂

[@deeptiacharya6247]

Thank you so much for the nicely explained video. Good Job Akash 👍

[@payalverma4653]

Thank you so much for the insights , It was helpful.

[@anuj7286]

Thankyou sm for the tutorial :)

[@shailendrakewat2984]

how to Reduce unused JavaScript code in react js please help

[@harshsinha7642]

Thank you so much for the info , really loved it.
For authenticated pages I am unable to generate report on lighthouse in react. How can we achieve this ?

[@anchalgupta996]

Nice tutorial 👌

[@onecuriousmuggle]

Very informative 💯

[@DeepakVerma-xl9wx]

Great Video, make more videos like this to improve performance of the app

[@parth2439]

Thank you!!

[@09sangram]

Great video

[@vishnups5435]

is it better if I use svgs instead ?

[@akashgupta-jh5vo]

Thanks for this video…

[@nextmashglimpse8781]

Hi, I have made my website on WordPress and as u said in video, my performance is showing 57 and first contenful, largest contentful paint, and speed index is in red color, how to resolve that.....plz help me

[@akshaytari4994]

NIce Information.
How to handle 3rd party scripts like(Global site tag, Zoom-Info Code etc) without reducing page speed performance?

[@mohitpathak8020]

Helpful

[@naimarafat4186]

Please make a video for shopify speed optimization.

[@unnatijadhav1699]

Can you please make a video on tree shaking with create react app?

[@deemscience1894]

Hey brother please help me to fix this mess : Hey there; I got this problem: Browser errors were logged to the console specifying [ syntax error : Unexpected token '

[@jfkongphop549]

did you have source code for following implementation

[@user-op5ty5ei3u]

sir please a video on next js how can i improve performance in next js

[@UsefulClips_]

where us lcp video link

[@AnjanaBarman-f8v]

wordpress wali website me kese hoga??????

[@mosin8673]

bundle of Thanks. Subscribe Done !

[@sunilbalbantaray7126]

bhai, after signup/ login can we test the performance of that screen ? because after passing the logged in URL, it shows the report for login screen. please let know if any solution to test Logged in screen perf

[@shakirraza1423]

Bro For your solution you need a global state which save your loging info, So you get your desired things through setting a default value of state.

[@abhishekaggarwal8166]

Very informative

[@akashingole]

Thanks bro

[@rlxgroot278]

can't we use tag with async or defer rather than settimeout?
btw great content please keep uploading this type of video

[@akashingole]

Hi, Great Question, the code I have used is written within Script tag and not fetched from url.
You can try making a file and put that code over there and fetch it using defer as async won't help much here.
I have tried all 3 options and the current one worked great over here 😊
Thanks for asking 🙂

[@rlxgroot278]

@@akashingole oh i got it thanks 👍

[@ashishten538]

Bro talk about unused Java script and unused css

[@oyobiryani]

Final Price bhi boldo bhai ahahah

[@avishetty8]

audio level is too low and cant hear you

[@niklausmikaelson7332]

Js ko defer kr do na

[@amansaxena4446]

video ki performance kharab ho jati h ye kya tha bhai

[@FurkanAfturk]

Aby bro 😅 Aage krke dekhte hu, video ke performance khrab hojati hai.. Point hai 😂

[@akashingole]

😅

[@pez5491]

Mate why do u speak a mixed language