Google Polymer is more than just a polyfill for Web Components. It has an ambitious agenda for pushing the Web Components specifications forward and lead the web development community in that area. In this post, we will explore what Google Polymer has to offer: polyfills, a framework, and pre-built elements. Although the polyfills portion will go away once browsers catch up to the Web Components spec, what is left behind is an interesting framework and suite of components.
Web Components will completely change the way we code for the web. To demonstrate this, I will be creating a new HTML tag called “<basem-emara>” that will act as my own personal vCard.
Managing dependencies is baked into many languages and is a cornerstone to creating modular architectures. Now, HTML joins the ranks and will also offer dependency management. Introducing HTML Imports!
Encapsulation is a very welcomed feature for HTML. This has been made possible with the introduction of Shadow DOM. Conflicts will be reduced tremendously and 3rd party libraries will play nicely with each other. In this post, I would like to focus on Shadow DOM and what it can do.
Did you know there’s a shiny new <template> tag making it to a browser near you? It’s true! For years, web developers have been coming up with awkward and clever hacks to do client-side templating. With the new Web Component specs, the templates piece is now included natively!
Web developers love inheritance, don’t you? Who would have thought you can inherit something so basic as an HTML element and extend it! Now you can do this using the new Web Components specifications.
With HTML5 came the introduction of semantic tags. Content could now be wrapped within much more appropriately named tags such as: