@skatejs/ssr/perf/use-custom-element.html

Server-side render your web components.

<script src="./index.js"></script>
<script>
  customElements.define('shadow-root', class extends HTMLElement {
    connectedCallback () {
      const { parentNode } = this;
      parentNode.removeChild(this);
      parentNode.attachShadow({ mode: 'open' }).innerHTML = this.innerHTML;
    }
  });
</script>
<script>
  test(a => {
    const div = document.createElement('div');
    div.innerHTML = `<shadow-root><strong><slot></slot><strong></shadow-root>${a}`;
    return div;
  });
</script>