Mozilla Brick：一个 Web 组件 Polyfill 库

Web 组件是一个 W3C 规范，它旨在使 Web 开发人员能够定义具有非常丰富的视觉效果和高可交互性且易于组合的小组件。 Brick 库提供了新的自定义 HTML 标签，从而抽象了用户常用接口模式。在浏览器本身支持类似标签之前，开发人员可以使用 Brick。

Brick 基于 Mozilla 的 X-Tag polyfill 库，因此，要运行依赖任何 Brick 标签的代码，开发人员需要先将 window.onload 替换为 x-tags 库的“DOMComponentsLoaded”事件:

 
document.addEventListener('DOMComponentsLoaded', function(){   
// 在这里添加可运行代码... 
});

在写作本文的时候，Brick 包含 13 个不同的标签（“bricks”），它们中的大部分都完全相互独立，甚至可以分别下载，而不是一起打包下载：

1. “导航栏（Appbar）”
2. “日历（Calendar）”
3. “日期选择器（Datepicker）”
4. “面板（Deck）”
5. “翻转框（Flipbox）”
6. “图标按钮（Iconbutton）”
7. “布局（Layout）”
8. “滚动框（Slidebox）”
9. “滚动条（Slider）”
10. “选项卡（Tabbar）”
11. “开关（Toggle）”
12. “开关组（Togglegroup）”
13. “提示框（Tooltip）”

下面是日历标签的样子：

 
<x-calendar></x-calendar> 

Google 非常信任 Web 组件，它也正在开发一个名为 Polymer 的 Web 组件 polyfill 库，该库试图在现有的浏览器基本结构上充分利用“影子 DOM（Shadow DOM）”、“自定义元素（Custom Elements）”和“模型驱动视图（Model Driven Vies）”等未来技术。

值得一提的是，虽然在过去的一年里 Web 组件的发展势头看上去很好，但是 Web 组件规范变化很快，还有许多方面不确定。几周前，来自 Google 的 Dimitri Glazkov 在 W3C 邮件列表中提议，从规范中删除元素。关于这一点，他们一致认为， 已拟定的元素语法不够好，在实现标准化之前，应该把这个问题留给各实现库来探索，正如来自 Apollo Group 的 Brian Kardell 所说：

像 x-tags 和 polymer 这样的项目，甚至是像 Ember 和 Angular 这样的项目，要给他们机会，让他们带头提出那些问题并帮忙给出具有潜在竞争力的答案——在我看来，没有必要急于在这一点上进行高层次的标准化。

查看英文原文： Mozilla Brick: A Polyfill Library for Web Components