Почему производительность операций быстрее в Virtual DOM чем в реальном DOM

Virtual DOM — это легковесная копия реального DOM в виде JavaScript-объектов. При изменениях: 1. Сначала обновляется Virtual DOM (быстро, т.к. это просто JS-операции) 2. Затем React сравнивает старый и новый Virtual DOM (diffing алгоритм) 3. На последнем шаге применяются только необходимые изменения к реальному DOM (минимальные операции) Пример: ```jsx // До

• First
• Second

// После

• First
• Second
• Third

``` React определит, что изменился только один элемент, и добавит лишь последний `

`, вместо перерисовки всего списка. Прямые манипуляции с DOM дорогие из-за рефлов и репаинтов браузера.