Mozilla Brick:一个Web组件Polyfill库

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

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

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

在写做本文的时候,Brick包含13个不一样的标签(“bricks”),它们中的大部分都彻底相互独立,甚至能够分别下载,而不是一块儿打包下载:github

  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)”

下面是日历标签的样子:web

<x-calendar></x-calendar> 

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

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

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

相关文章
相关标签/搜索