Many of us have heard about web components and shadow DOM elements as up-and-coming technologies for front-end development. They certainly sound cool, but what can they actually be used for, right now? At the time of writing this proposal, there aren’t a lot of good tutorials to get started using them available on the web. We’ll take a look at the proposed W3C spec and the current state of implementation (including libraries and polyfills for cross-browser niceness), but we’ll also go a step further and dive into the DOM with live coding to show what can be done with JavaScript to play with these components and how they can be used for rapid wireframe and prototype development.

Inspector Web and the Mystery of the Shadow DOM