Shadow DOM




Web Components


Templates
Custom Elements

Shadow DOM

Imports

Co daje nam Shadow DOM?





  1. Enkapsulacja
  2. Przyrost wydajności





Shadow Boundary



Reguły CSS zdefiniowane w Shadow Dom działają tylko dla dzieci ShadowRoot.







Demo

Jak poprawić nasz kod?




Jak poprawić nasz kod?




Reflow




Wsparcie przeglądarek





Co można zrobić już teraz?





  1. IFrame
  2. Dobrze napisane style
  3. Polymer


Polymer project




Shadow DOM

By kaapa

Shadow DOM

  • 1,201