Web Components were the craze for a while. As with all standardization projects, as time passes, the effect wears off. In 2012 standardization of the web components specs felt near. Today it’s still a work in progress. There are a growing number of promising approaches and technical solutions, though. Instead of forcing you to roam the depths and widths of the web to collect vital information on web components, the community itself, supported by staff from Google and Mozilla, decided to create a central platform, covering all aspects of the future technology. Now that effort is online. It answers to the name WebComponents.org.
Why Web Components Are The Future of The Web
What do you say? You haven’t heard about web components until now? Or have already forgotten about its concepts? Don’t worry, we’ll send a really brief introduction your way.
The traditional concepts of web design were not meant to allow to create websites from different, independent modules. And though, this seems possible, it is at least not without the risk of one module getting in the ways of others.
To avoid the inherent problems, the working draft on web components introduces several new technical solution with the most important being HTML Imports, Custom Elements and Shadow DOM. HTML Imports allows you to embed external HTML. Custom Elements allows the creation of custom tags following the same syntax as native elements. And Shadow DOM hides application sections from view in the main DOM, so that no other DOM part is able to access them.
To make the most important and most promising parts of the new specs available for practical use today, teams from the dominating browser developers Google and Mozilla started to create interim solutions. The best known projects are X-Tags by Mozilla and Polymer by Google. Both concentrate on Custom Elements.
Generally all projects are designed to make themselves redundant over time. Polymer for example checks the web components capabilities of the calling browser on runtime and only cares for the parts of the spec that are not natively supported.
WebComponents.org: All You Need to Know Under One Roof
The new project WebComponents.org was originally planned as a kind of wiki for community members. With some members’ motivation to create being so high it developed to become not a another dry wiki, but a fresh and modern website, with its own logo even. The goal of the project is to centralize the available information, solutions, specs, presentations, best practices and what not.
Go to WebComponents.org to access the different specs in their respective states of work. Look at best practices already working today. Read a bunch of articles and tutorials introducing you to the basics, then leading you to advanced knowledge. Look at presentation videos or slides with content given during the many conferences out there. A section with resources collects solutions such as the above mentioned X-Tags, Polymer and more. The more or less empty section Sandbox is supposed to be filled with concrete proposals of what should be declared how.
Although the site has just started out, it already carries an amount of information that will keep you busy for a while. If you are looking for a rock-solid entrance into the world of web components, this is the place to go.
Dieter Petereit is Noupe's Editor-In-Chief and a veteran of the web with over 25 years of experience in the world of IT. As soon as Netscape became available he started to do what already at that time was called webdesign and has carried on ever since. Almost a decade ago he started writing for several online publications, some well, some lesser known. Dieter is a heavy G-Plusser, so why not meet him over there?