After compiling jsx to js, functions are created. Functions are nested in other functions, and other functions are nested too. If you call the topmost function, you will first get VirtualDOM, and then just DOM.
So far, so good. But now we need to change some data in the application, and change our DOM based on them. And here are the different nuances: Are all the changes equally useful? What edits will cause the re-renderer, and which not? How does React choose what to change? What changes in VirtualDOM will cause changes to the DOM, and which ones do not? How to organize your data so that the application works as quickly as possible?
If, when you enter data into the text field, your entire application starts to slow down, the checkboxes are set for half a second, and the animations are lagging, then my talk will be useful to you.