WebComponents
カプセル化したコンポーネントスタイルをWeb標準（どのブラウザでも）で利用可能とするもの。
そもそも
react + styeled-component(CSS in JS)のような構成を一般化したもの（と理解）。
標準、ということで、JSさえ用意できれば、CDNなどを通して広く使えるコンポーネントが提供できる、ということか。
styled-component（CSS in JS)
半々くらいで賛否が別れているような状況
カスタム要素
カスタムタグをJSで追加すれば、その後のHTML内で利用できる。
customElements.define('word-count', WordCount, { extends: 'p' });
<word-count></word-count>
シャドウDOM
DOMツリーのカプセル化。シャドウDOMと呼ばれる仮想ツリーを構築し、名前空間を構築する。
最大のメリットはなんといってもCSSのカプセル化。
template
- タグの組み合わせの集合体
- 描画されない
- カスタム要素に読み込める
slot
- カプセル化に対するパラメータ