WebComponents.org: All About The Future of The Web
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 idea behind web components evolved with the growing capabilities of modern browsers. Browsers and their underlying hardware layer are powerful enough today, to have them run full-fledged applications. They are no longer only windows to show you some hypertext. As long as one developer (or team, for that matter) is able to control the application logic of a website entirely, all is well. JavaScript is a proven method. But as soon as more than one application is supposed to run on the same website, e.g. in the form of separate widgets, things start to become difficult.
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.
Related Links
- WebComponents.org | Everything you need to know
- X-Tags | Mozilla
- Polymer | Google