Mastering Virtual DOM: React Interview Questions
What is Virtual DOM in React? This is just a JavaScript object! I think you've probably heard many times - that the real browser DOM is very slow and making changes to it is unproductive. And that React has this magical thing called the Virtual DOM, which makes your application fast.
#reactjs #react #codinginterview
------------------------------------------------
Hello, my name is Konstantyn, I'm a Senior Frontend Engineer working in the lovely city of Warsaw. My main technology stack is React. Please ask me questions in comments and subscribe for more tutorials like this!
✅ Follow Me:
LinkedIn: / kostiantyn-burlai
GitHub: https://github.com/burlai
☕ Buy Me A Coffee: https://www.buymeacoffee.com/konstantyn
-------------------------------------------------
Many tutorials on the internet, on YouTube, and even the official documentation, talk about things like "Virtual DOM is a representation of a real DOM made in React." But what exactly is this representation? What kind of magic is React doing under the hood to make our interface updates fast and efficient?
The answer that interviewers, senior developers, and tech leads are waiting from you is this - the virtual representation is just a JavaScript object!
React works in a way that every change the user makes in the UI - clicking buttons, typing into input fields, and so on - triggers a process in React called reconciliation. The details of what is reconciliation is a topic for another video, but in the context of the virtual DOM, all you need to understand is that there was an old state of object in JavaScript, and after the changes in the interface, React simply checks what needs to be changed in the JAVASCRIPT OBJECT. After identifying the parts that require modification, React updates those specific parts of the JavaScript object. Once React ensures that there are no more changes, the updates in the Virtual DOM are propagated to the browser's real DOM. This is precisely what makes React so performant.
Two other concepts closely related to the idea of the Virtual DOM in React are reconciliation and batching. And those are topics for another video, which I'll be releasing soon, so please subscribe not to miss it.
That's all you need to know about the Virtual DOM as a React developer. Thank you for watching this video. Please hit that like button & happy coding!
![Bartosz Domiczek - D2 Talks #33 [interviewed by Fabio Palvelli]](https://images.mixrolikus.cc/video/_sQkFBCvblE)
