Чем реализация Virtual DOM отличается от createDocumentFragment (), если состояние не наблюдается?
Виртуальный DOM - это облегченная копия DOM, которая поддерживается / кэшируется локально перед вставкой в реальный DOM. Мы можем изменить его по своему желанию, а затем сохранить в нашем реальном дереве DOM. Он использует эффективные алгоритмы сравнения для обновления изменений вперед и назад и других случаев использования.
Все это сделано для того, чтобы избежать прямых манипуляций с DOM, поскольку это дорогостоящая операция.
У нас есть метод document.createDocumentFragment (), который можно использовать в JavaScript, который также создает объекты узлов воображаемого дерева для вставки в DOM.
Я хотел бы знать, если у меня нет представления / компонента, который должен наблюдать за каким-либо состоянием или двунаправленной привязкой (например, просто визуализировать шаблон с помощью переданных опций и обрабатывать события в DOM), действительно ли Virtual DOM изменит это сценарии?
Или это так же хорошо, как createDocumentFragment (), если все, что ему нужно сделать, это просто рендеринг и отсутствие наблюдения за состоянием.
Virtual DOM React не имеет никакого отношения к DocumentFragment. Отсюда назревает ответ на ваш вопрос, что реализация отличается всем.
Он использует эффективные алгоритмы сравнения для обновления изменений вперед и назад и других случаев использования.
Virtual DOM это лишь упрошенная модель DOM-древа, никаких алгоритмов Virtual DOM не использует, это делает ReactDOM при сверке древа. Никаких вставок Virtual DOM в реальный DOM не происходит. Хотя бы по причине полной несовместимости.
Если вам действительно интересно как происходит работа с Virtual DOM и сверка в React, то можете прочитать одну из многочисленных статей на эту тему.
Разница в том что VirtualDom делают на JS на супер простых объектах с ограниченным функционалом и это очень быстро по сравнению с настоящим DOM, которые заметно сложнее и заметно медленнее.
Я хотел бы знать, если у меня нет представления / компонента, который должен наблюдать за каким-либо состоянием или двунаправленной привязкой (например, просто визуализировать шаблон с помощью переданных опций и обрабатывать события в DOM), действительно ли Virtual DOM изменит это сценарии?
Если ваш результирующий HTML не меняется в процессе работы - то можно и без virtualDom. Но это будет просто статичный HTML файл.
Если HTML как-то меняется - то подход с virtualDom может оптимизировать эти изменения.
Даже если у вас нет явного состояния, но в процессе работы вы хоть как-то меняете страницу - значит где-то это состояние есть. И вы меняете html в момент когда это состояние меняется, например
просто визуализировать шаблон с помощью переданных опций и обрабатывать события в DOM
Простой
Сложный