Mozilla Brick: A Web Component Polyfill Library

Web Components are a broad specification designed to enable Web developers to define widgets that are very rich in visuals and are highly interactive and easy to assemble. The Brick library provides a new custom HTML tag that abstracts the user's common interface patterns. Developers can use brick before the browser itself supports similar tags.

Brick is based on the Mozilla X-tag Polyfill Library, so to run code that relies on any brick tag, the developer first needs to replace window.onload with the X-tags event for the Vault:

Document.addeventlistener (' domcomponentsloaded ', function () {//) Add the code to run here ...});

When writing this article, brick contains 13 different tags ("bricks"), most of which are completely independent of each other and can even be downloaded separately, rather than packaged and downloaded together:

1. "Navigation bar (Appbar)"
2. Calendar
3. "Date picker (Datepicker)"
4. "Panel (Deck)"
5. "Flip Box (Flipbox)"
6. "icon button (Iconbutton)"
7. "Layout"
8. "scroll box (slidebox)"
9. scroll bar (slider)
10. tab (Tabbar)
11. "Switch (Toggle)"
12. "Switch Group (togglegroup)"
13. "Prompt Box (tooltip)"

Here's what the calendar label looks like:

Google trusts Web Components very much, and it is also developing a Web Component Polyfill library called Polymer, which attempts to take full advantage of the Shadow Dom (Shadow DOM), custom Elements, on the existing browser infrastructure and "Model driven Vies" for future technologies.

It is worth mentioning that, although the development of Web Components in the past year looks good, but the Web Component specification changes quickly, there are many aspects of uncertainty. A few weeks ago, Dimitri Glazkov from Google proposed to remove the <element> element from the specification in its mailing list. In this connection, they agreed that the proposed <element> element syntax was not good enough and should be left to the implementation libraries to explore before standardizing, as Brian Kardell from the Apollo group said:

Projects like X-tags and polymer, even projects like Ember and angular, give them the opportunity to take the lead in presenting those questions and help give them a potentially competitive answer-in my view, there is no need to rush to high-level standardization at this point.

Mozilla Brick: A Web Component Polyfill Library