5

В статьях на ShadowDOM кажется, что это усовершенствование DocumentFragments. Какова реальная выгода от ShadowDOM? Специфика CSS? Разве я не могу сделать примерно то же самое с Фрагментами?ShadowDOM vs Document Fragments - Как они отличаются?

Я ищу список возможностей для каждого. Например, оба, похоже, позволяют собирать дерево доминирования в памяти и вне основного пути рендеринга. Тем не менее, ShadowDOM, похоже, обладает дополнительным преимуществом CSS.

В каких случаях вы используете ShadowDOM и где хотите просто использовать DocumentFragments?

UPDATE

После рассмотрю это более себя, я вижу две технологии полностью ортогональны.

Примечание: Поскольку вопрос был закрыт, я не могу ответить на него сам. Я изначально рассказывал о своих выводах в комментарии ниже, но решил, что больше людей проверит текст здесь.

документ Фрагменты является строительство инструмента JavaScript/DOM, используемый для создания неиерархических коллекции узлов (каждый из которых может быть родителем других узлов) от DOM. Они по сути являются оберткой вокруг коллекции узлов, которая остается заброшенной после добавления фрагмента в DOM. DocumentFragments позволяет вам собирать несколько узлов на одном уровне и присоединять их к другому узлу DOM в качестве братьев и сестер.

Shadow Dom - все об изолировании побочных эффектов в большом рендерированном DOM. ShadowDom позволяет создавать изолированные компоненты с изолированной изоляцией с инкапсулированными стилями. Когда компонент ShadowDom добавляется в большее веб-приложение, его стили CSS не будут просачиваться в остальную часть приложения, и собственные стили приложения не влияют на рендеринг компонента.

Обратите внимание, что комбинаторы CSS, такие как /deep/ и ::shadow, существуют для стилизации (и выделения) компонентов shadowDom из родительского dom, но в ближайшее время они устарели. Из-за этого рекомендуется повторно использовать Компоненты, использующие ShadowDOM, полагаться на переменные CSS для стилизации, если они предназначены для настройки приложения, которое их потребляет.

+2

Не знаете, как это «в основном основано на мнениях». Я не просил ни о каких мнениях, а о объективном сравнении и противопоставлении возможностей и целей. – Gopherkhan

+2

Редактирование должно быть перенесено в ответ. Поэтому вопрос должен быть вновь открыт. – Oriol

+0

Как нуб, изучающий веб-компоненты, у меня был такой же вопрос и выучил много здесь. Эти типы вопросов не должны быть закрыты, но после ответа следует заблокировать, чтобы предотвратить спам ответов. – Callat

ответ

4

Из того, что я прочитал и как его использовать, это ShadowDom имеет отношение к капсулирования, как если поместить <style> тег внутри ShadowDom CSS-код будет применяться только к ShadowDom и фрагменты документа связаны с перепланированием браузера

+1

Я бы также добавил, что у них есть совершенно разные фокусы. Фрагменты документа - это инструмент построения дома, используемый для создания неиерархической коллекции домиков dom (которые сами могут иметь иерархию) от dom. Они по сути являются оберткой вокруг коллекции узлов, которая остается заброшенной после добавления фрагмента к dom.Это позволяет вам собирать несколько узлов на одном уровне и отбрасывать их в dom как братья и сестры. Shadow Dom - все о изоляции побочных эффектов внутри вынесенных догм. – Gopherkhan

Смежные вопросы