Client-side Apps

From The Future

Web ComponentsNow Introducing

Support Is Strong With This One

ChromeFirefox Safari

Polymer & X-Tags

DartAKA that Google thing that had 1759 lines in a Hello World App

What Are You

Talking About?

Shadow DOM - Encapsulation

HTML Templates - Structure/Scaffolding

Custom Elements - Extend The DOM

HTML Imports

Shadow DOM

Example

HTML Templates

Parsed But

Not RenderedIt's just DOM...

Example

Custom Elements

Just like any ol'

trusty HTML Tag

Declarative

and

Imperative

Declarative API

Imperative API

Shadow DOM + Custom Elements

HTML Imports

Model Driven Views

Sources- W3C Web Components Spec http://www.w3.org/TR/2013/WD-components-intro-20130606/- Polymer http://www.polymer-project.org/- X-tags http://ui.x-tags.org/- Web Components by Eric Bidleman http://html5-demos.appspot.com/static/webcomponents/index.html#1- Shadow DOM 101 http://www.html5rocks.com/en/tutorials/webcomponents/shadowdom/