自定义元素 VS MutationObservers

当发生 DOM 改变的时候,自定义元素回调会同步调用,而 MutationObservers 收集这些改变并异步调用其中的一批。对于组织逻辑这并不是什么大问题,但是它会在内存清理阶段引发一些不可预见的 bugs。当待处理的数据还存在时,有一个小的时间间隔是危险的。

另一个重要的区别是, MutationObservers 没有进入 shadow DOM 边界。监听 shadow DOM 里面的改变需要自定义元素或者手动为 shadow 根目录添加一个 MutationObserver。如果你从来没有听说过 shadow DOM,你可以在 here 查看更多。

最后,他们提供了略有不同的挂钩。自定义元素有 adoptedCallback 钩子,然而 MutationObservers 可以在任意层次监听文本的改变和子元素的改变。

综上所述,把这两者的最好的方面结合起来使用是一个好主意。