摘要：隨著頁面中相同或類似的增加，使得代碼冗余度增加，的重用性問題日益彰顯。影子使得這些與主文檔的保持分離。分離的原因是如果復雜頁面沒有很好的組織結構，樣式容易覆蓋。

早期在我們構建web頁面時，基本上都是通過組合HTML提供的標簽來實現的，再簡單點我們還可以拷貝黏貼bootstrap的css代碼。隨著頁面中相同或類似UI的增加，使得代碼冗余度增加，UI的重用性問題日益彰顯。

盡管像angular這樣的框架可以解決組件標簽化重用的問題，但是框架間的組件重用顯得無能為力了。

這時 Web Components 的概念就出現了。

它是一系列web平臺APIs（瀏覽器提供），允許你創建自定義的，可重用的，封裝的HTML標簽。簡單點說就是一系列接口規則，希望瀏覽器們可以提供給開發者，但是由于瀏覽器政治存在，進度是緩慢的。

既然需要瀏覽器來實現，也就需要規范，Web Components有四個規范（其中最重要的就是自定義元素和影子DOM）：

自定義一些新的HTML標簽，聲明其行為和樣式。可以分為兩類：自定義標簽和自定義內置元素。

為Web Components中的DOM和CSS提供封裝。影子DOM使得這些與主文檔的DOM保持分離。分離的原因是如果復雜頁面沒有很好的CSS組織結構，樣式容易覆蓋。

支持