使用Shadow DOM的缺点是什么？

Question

在教程中我只看到了Shadow DOM的好处，但也应该有缺点。我们应该避免使用Shadow DOM？

Answer 1

影子DOM的功能可以被看作是缺点一样多的好处：

风格隔离一个好处，如果你想要，但如果用户想要从全局CSS样式阴影DOM组件的缺点样式表。

DOM Shadowing在某些情况下是有益的，但是如果外部脚本/库或扩展需要解析或选择内容，则会带来一些缺点。

有很多第三方库（或扩展）不能用于Shadow DOM内容，因为它们不是用来处理它，或者需要一些额外的配置才能使用Shadow DOM。

例子：

• Disqus comments integration
• CodeMirror editor integration
• Wiris math editor integration

同样，解析HTML将在影子DOM边界被封锁的扩展：一个好处，如果你不想如果您认为这些服务是一项有用的服务，那么这是一个缺点。

事件传播在Shadow DOM内部和外部是不同的。所以你可能有一些扩展来处理UI事件。

例子：

• TinyMCE integration

结论

• 只有当你想CSS样式或DOM隔离使用阴影DOM。

• 如果您需要与一些不兼容的第三方组件或库进行交互，请勿使用Shadow DOM。

Answer 2

啊，这个技术的规范还没有稳定下来，很多浏览器都不支持。我会说这个缺点。

参见：https://developer.mozilla.org/en-US/docs/Web/API/Element/attachShadow

现在我会说;在大多数情况下避免，除非您想尝试新的东西，并且不适用于生产环境。