Your browser doesn't support the features required by impress.js, so you are presented with a simplified version of this presentation.

For the best experience please use the latest Chrome, Safari or Firefox browser.

web components 

and

 the shadow dom

Reusable encapsulated components for the web

DRY

native, no js!

share

mod

control &

encapsulate

WAT?

HOW?

 the shadow dom

image/svg+xml
Mess With The Video

...HOW? (aka HOW2)

how2
 
           
           <element extends="div" is="x-nyandiv">
             <template>
               <img src="http://www.nyan.cat/cats/skrillex.gif" 
                       alt="wub">
               </img>
               <content select=".interesting_but_badly_formatted"></content>
             </template>
           </element>
           

           
           <div  is="x-nyandiv">
             <p class="interesting_but_badly_formatted"> blah blah blah </p>
             <img class="baby_photos_on_facebook" src="faceamothercouldlove.jpg"> 
             </img>
           <div>
           
           

+@dglaskov

+webcomponents

Polyfill

Readable Spec

Awesome Talks

Use a spacebar or arrow keys to navigate