How React Works behind the scenes - Pluralsight audition

[@19joaoreis96]

Really good, I honestly don't know why this has so low number of views, it's the best one I found to introduce me to React. Thank you sir for taking your time to explain so patiently and detailed how the DOM is changed and how React changed the rendering "game".

[@codewithsandip]

Thanks

[@krylonpoet]

Of all the videos that I’ve watched on react this is by far the most clear explanation of what react does behind the scenes. It’s also backed up with a very simple example that demonstrates the power of react.

[@codewithsandip]

Thanks

[@אלעדר]

I agree

[@PurpleCJ]

This video is the definition of Crystal Clear!

[@codewithsandip]

Thanks 🙏

[@markotweyo]

This is the best explanation about React on RUclips.

[@codewithsandip]

Thanks. Glad you liked it.

[@prasada2874]

The best explanation of "React Virtual DOM" I have ever seen. Simple , Clean & Precise. Thanks a lot !!

[@codewithsandip]

Thanks

[@sambritpradhan9735]

Best way of explanation...thank you very much Sandip.

[@codewithsandip]

Glad u liked it. Thanks.

[@ryryadaya6835]

I wish you could create more tutorials about React, and I agree with the rest of this dude you really did a good job here! Thank you!

[@codewithsandip]

Yup, working on it.

[@rakibulhashan5446]

The Easiest example and explanation I have ever seen!!

[@codewithsandip]

Thanks

[@rajjasoliya9147]

one of the best explaination on DOM thanks sir please keep it up

[@codewithsandip]

Thanks

[@aravindvenkata8475]

REALLY SO BRILLIANT AND SOOOOO INFORMATIVE

[@codewithsandip]

Thanks

[@lauramangu2516]

Thank you for taking the time to do this! As others said, one of the most clear explained videos! Keep it up!

[@codewithsandip]

Thanks

[@ayushikarn1893]

i learn only by doing. I have now understood the Virtual DOM . omg how good this explanation is just wow.

[@codewithsandip]

Thanks

[@kpcPrasad]

I have been roaming around the internet for days and finally found the FABULOUS explanation of Virtual DOM. Thanks

[@codewithsandip]

Thanks

[@anshshrivastava9107]

the 7 dislikes are from the ones who don't know react.
Great video man I learnt something new today.

[@codewithsandip]

Thanks

[@ruchish4]

woww... what a simple yet powerful way to explain react working. Amazing work. This video should get millions of views. Thank you so much !!

[@codewithsandip]

Glad you liked it!

[@dhevendhiranm4138]

Excellent! Very informative using simple terms and with clear explanations. Thanks for the video.

[@codewithsandip]

Thanks. I m glad you liked it.

[@sandeepghosh_me]

one of the best video found to understand the react. Thankyou !

[@codewithsandip]

Thanks

[@ArpithaIndira]

Okay nice explanation with detailed example..keeping creating more like this ..thank you ❤

[@prayasarora]

Wow, that was such an awesome video. I have been learning react from a few months now and always see people directly jumping to the codes without assisting with things like DOM manipulation, Virtual DOM to name a few. Thank you so much for this fruitful video. Please go ahead and make more informative content on complex topics like this.

[@codewithsandip]

Thanks. Glad you liked it. I m on it.

[@user-kh5ux5cy6q]

Nice video! Thank you for the thorough explanation.

[@magik7395]

Best video I have seen for What is React, very clear explanation.

[@codewithsandip]

Glad it was helpful!

[@subhashgn1775]

Thank you, your explanations were very clear.

[@codewithsandip]

Thanks

[@nayeemahmed5169]

How nice demonstration it is!! This is pretty much helpful to understand React. Thank you so much Sandip.

[@codewithsandip]

Thanks.

[@murageshnad2420]

wow, Amazing explanation sir, now i got how react works..

[@codewithsandip]

Glad it helped

[@vinobhamanoharan5068]

It's really great... Thank you for your effort. I wish you to create more useful videos...

[@codewithsandip]

Thanks

[@missinglink2416]

The clearest explanation!!!!!

[@codewithsandip]

Thanks

[@shubhajithalder2054]

Exactly what I was looking for. Best explanation ever with live example.

[@codewithsandip]

Glad it helped. Thanks.

[@muhammadtalhabaig1725]

Thank you brother for such a good explanation!

[@codewithsandip]

Thanks 🙏

[@khursheedalam3057]

Very well explanation. One small question, where this Virtual DOM data store as it keeps current and Prev state for compare it.

[@codewithsandip]

I think it should be in memory which browsers environment

[@jahajbalal8502]

Perfect example on how virtual dom works , really informative ..
Thanks sir

[@codewithsandip]

Thanks

[@rahulsyt_]

Offf....Sooo...finally I got to know how React works. Thanks a lot, Brother!

[@codewithsandip]

Thanks

[@nikunjsoni123]

Thanks for wonderful explanation of React! Very nice video!

[@codewithsandip]

Thanks

[@tripathysantanu]

I am a big fan of you now and I am watching every single video of your channel 🙏🙏
As always this video was clear and concise and very useful 👍

[@codewithsandip]

Thanks

[@shaswatsankalp8223]

Really helpful and interactive thank you

[@codewithsandip]

Thanks

[@kunpeng8646]

the BEST one in terms of explaining how React works! look 8:20, it's a moment of "I got"!!

[@codewithsandip]

Glad it helped.

[@anassaifi7613]

Bestest explanation on RUclips

[@codewithsandip]

Glad you think so!

[@emmanuelmonlenyode83]

A million thanks for this explanation

[@codewithsandip]

Glad it was helpful!

[@Yathavan5947]

TBH great work simple yet clean
Thank you ❤

[@codewithsandip]

Glad you like it!

[@eyasuberg2717]

Excellent! Clear and to the point! Thank you!!!

[@codewithsandip]

Thanks

[@kiransaravade5127]

crystal clear explanation !! thanx

[@codewithsandip]

Thanks

[@billchen4923]

Awesome video, you really explain Virtual Dom crytical clear.

[@codewithsandip]

Glad it was helpful!

[@madannikalje760]

So neat and clean explanation ❤️👍🏻

[@codewithsandip]

Thanks

[@shilpachauhan9178]

want this code to watch and play with it, I know it's not possible now. But,I must say you are very amazing explainer.Thank You

[@codewithsandip]

Thanks

[@touseefahmad9794]

Please make a complete video, how single page applications works under the hood.!

[@kimerared]

Excellent explanation. Thank you for making it easy to understand.

[@codewithsandip]

Thanks

[@DollarLachimi]

its really good. thanks a lot giving this.

[@codewithsandip]

Glad you like it!

[@RodneyKimbangu]

Best React "what-is" video I have found. God bless you, Sir!

[@codewithsandip]

Thanks

[@anilnagula5512]

Amazing 👏..
Keep doing videos on Web Development.

[@codewithsandip]

Thanks

[@orhanors1800]

Very clear explanation. Thanks

[@codewithsandip]

Thanks

[@arockdurai5110]

showing the DOM updates is very clever.

[@codewithsandip]

Thanks

[@dcodework2421]

Great video! thanks

[@codewithsandip]

Thanks

[@quanominh8879]

Really great explanation. Thanks

[@codewithsandip]

Thanks

[@binodthakur6113]

wow what a beautiful way of explanation.

[@codewithsandip]

Thanks

[@binodthakur6113]

Oh man where are you ,love your way of explaning thought it there would be react js videos but no videos.You should have made it.

[@codewithsandip]

Thanks

[@ScienceEtConscience]

Very well explained. Thanks.

[@codewithsandip]

Thanks 🙏

[@hitanshimehta430]

Amazing video!!!!

[@codewithsandip]

Thanks

[@achyutpal3865]

It's beautifully explained, Thank you.

[@codewithsandip]

Thanks

[@mackynyxz]

Nice explanation about virtual DOM

[@codewithsandip]

Thanks 🙏

[@prateeksaini9258]

Really Awesome Video 🤩🤩🤩

[@codewithsandip]

Thanks

[@ankurnarkhede]

GOD BLESS YOU!

[@codewithsandip]

Thanks

[@attamjotsingh4474]

Beautiful explanation

[@codewithsandip]

thanks

[@Todortodorov62]

thx, very nice demonstration

[@codewithsandip]

Glad you liked it. Thanks.

[@syedularif2421]

Thanks a lot i have bought two udemy course to learn react but none has explained like you. finally i have understood .Thank you so much. I wish you could make some tutorial on Udemy.

[@codewithsandip]

Glad you liked it. Thanks.

[@khalidkachachi6595]

Well explained dud 👍, thank you so much 🙏

[@codewithsandip]

Thanks. I m glad you liked it.

[@huuks527]

Great Example 👍

[@codewithsandip]

Thanks! 😃

[@pawe896]

Great explanation. Thank You :)

[@codewithsandip]

Thanks

[@kriskan743]

wow the most easy explained video on entire youtube!1!

[@codewithsandip]

Thanks

[@vishalvibes_]

Nice explaination!

[@codewithsandip]

Thanks

[@inamurrahman807]

Just amazing

[@codewithsandip]

Thanks

[@h4kster182]

The best explanation ever

[@codewithsandip]

Thanks

[@hasanmirarabshahi1956]

Very good explanation

[@codewithsandip]

Glad you liked it. Thanks.

[@jatinpandey703]

clock example was very helpful.

[@codewithsandip]

Glad it was helpful!

[@lamargtv2572]

Superb explanation

[@codewithsandip]

Thanks

[@umeshnaik1235]

Good explanation.

[@codewithsandip]

Thanks

[@realmicrobet]

+1 Great video!

[@codewithsandip]

Thanks

[@mgccgm4341]

Thank you!

[@codewithsandip]

You're welcome!

[@RameshPMKumar]

Nice explanation Sir. One question. I read some articles, saying that Plain JavaScript re-renders the entire DOM, while react renders the changed part. But here, plain js also refreshes the minimum part only. Can anyone explain on this please.

[@codewithsandip]

I will come up with one video showing the example.

[@DanKaschel]

The advantage to react is that you don't need to write code to guarantee that the minimum change is made. Instead, the Dom is compared with the virtual Dom to do that work for you.

[@youcefdeveloper8543]

It's more obvious for me know. Thank you so much buddy for the video.

[@codewithsandip]

Thanks

[@gopinathkrm58]

very nice explaination

[@codewithsandip]

Thanks

[@BabarAli-yb1eg]

IMO this is a very common mis conception regarding react that it only re renders what is changed and not the whole DOM. Since React is a library built on top of JS it does not have any additional superpower but it can work smartly.
In JS it is really easy and high performant to manipulate Objects when compared to DOM trees, React actually keeps the copy of dom in VDOM and manipulate that over the time very very quickly since it is very high performant to update objects and just map those changes and does its own batching.

[@toriolajohn3460]

Are you saying the analogy used in this video is not very accurate? If so, please kindly explain better or link to another video or blog that gives a more accurate information. Thank you

[@MithunKumar-qn9xv]

thanks sandip

[@codewithsandip]

Most welcome 🙏

[@d17-h2z]

Thank you man!

[@codewithsandip]

Thanks

[@gajananambekar3194]

Nice explanation 😊

[@codewithsandip]

Thanks 🙏

[@saxenaabhi]

wow, this is like finding a gem of a video. good work. but please speak a bit fast. I have to watch you like on 1.5 video speed.

[@codewithsandip]

I understand your concern that's why youtube has speed feature. I have to speak slowly so that everyone can understand. These videos are made keeping everyone in mind. Thanks for the feedback.

[@mamunethan1356]

Love from Bangladesh

[@prashantshekhar8404]

grt work

[@codewithsandip]

Thanks

[@Saurabhnaik]

Couldn't find your course on pluralsight
Please provide link

[@codewithsandip]

I got selected for pluralsight but getting a new course approved is really tough. You need to create unique content to get into pluralsight.

[@Saurabhnaik]

@@codewithsandip the way it was explained is very good, please keep making videos
Thanks 😀

[@westfield90]

I’m sorry but I’m a little confused. The painting of the ui is slow part right? So if the real dom receives changes at say node 4 from the virtual dom, does it not paint node 1, 2, 3 and 4 again? I guess my confusion is when you make a change in regular JavaScript to only node 4, how is that any different if the real dom is painting node 1,2,3 and 4 again. Perhaps I’m not understanding how the painting of the ui is done by the real dom

[@codewithsandip]

Hello, the beauty of react is it doesn't render the entire element but part of it. So if you have 4 employee in a list of employees and one of the employees status got updated, react in going to render that employee node only. You can achieve the same using JS also but it would be really cumbersome. I will be working on videos where I will compare the React projects with vanilla JS projects. Please be with me till that time :)

[@atg878]

I had a doubt that why the browser itself cannot implement the diffing algorithm

[@sarveshsakpal8241]

Amzing

[@codewithsandip]

Thanks 🙏

[@muhammadaliawan9672]

best Video

[@codewithsandip]

Thanks 🙏

[@sandip_bettereveryday]

Awesome

[@codewithsandip]

Thanks

[@umeshunnikrishnan47]

Good one.

[@codewithsandip]

Thanks

[@jashanpreet832]

Great

[@codewithsandip]

Thanks

[@juanhernandez2570]

perfect

[@codewithsandip]

Thanks

[@dipeshg8581]

Everybody keep saying render , render but what is rendering ?

[@dipeshg8581]

Please explain sir what is rendering in simple terms and whether print statement in normal coding language same as this rendering?

[@codewithsandip]

Hi Dipesh, we can say rendering is similar to drawing on a blank sheet of paper. So basically react is drawing into the Dom. But it doesn't sound good to say drawing. Hence this word render has been used. Btw great question I would look more into this and come back with small video possibly.

[@dipeshg8581]

@@codewithsandip thank a lot sir

[@sgaonkar8893]

thank you sir

[@codewithsandip]

Your welcome.

[@touhidsayed7393]

Sir can you provide source code of js and react clock

[@codewithsandip]

My Apology. Un fortunately I don't have source code for this one now. This was i have written online just for a demo.

[@inganzamarumpu]

now it's really clean, but it seems like jQuery do the same

[@codewithsandip]

Thanks

[@DanKaschel]

No. Not even a little bit.

[@abirpaul9027]

🥇🏆🏆🥇