Search code examples
dompolymerweb-componentshadow-domvirtual-dom

Are Web Components (Polymer) and/or Shadow DOM compatible with a Virtual DOM?

I am trying to wrap my head around whether a Web Component can take advantage of the speed improvements provided by a Virtual DOM. I am guessing the Shadow DOM might be a stumbling point.

I understand the concept of concept of the virtual DOM more so than the mysterious (to me) Shadow or Shady DOM.

Does the concept of virtual DOM diffing work with Shadow DOM, or are they incompatible?

eg, can the virtual-dom project work with Polymer web components?

Solution

  • Taken from André Staltz's Twitter, "Polymer elements don't work properly inside virtual-dom (and Cycle.js) because of polyfills, see this https://github.com/Matt-Esch/virtual-dom/pull/296"

    and

    "Otherwise, plain web components work perfectly with virtual-dom.", with an example, https://github.com/staltz/mvi-wc-poc