Web 组件是一个 W3C 规范，它旨在使 Web 开发人员能够定义具有非常丰富的视觉效果和高可交互性且易于组合的小组件。 Brick 库提供了新的自定义 HTML 标签，从而抽象了用户常用接口模式。在浏览器本身支持类似标签之前，开发人员可以使用 Brick。
Brick 基于 Mozilla 的 X-Tag polyfill 库，因此，要运行依赖任何 Brick 标签的代码，开发人员需要先将 window.onload 替换为 x-tags 库的“DOMComponentsLoaded”事件:
document.addEventListener('DOMComponentsLoaded', function(){ // 在这里添加可运行代码... });
在写作本文的时候，Brick 包含 13 个不同的标签（“bricks”），它们中的大部分都完全相互独立，甚至可以分别下载，而不是一起打包下载：
- “导航栏（Appbar）”
- “日历（Calendar）”
- “日期选择器（Datepicker）”
- “面板（Deck）”
- “翻转框（Flipbox）”
- “图标按钮（Iconbutton）”
- “布局（Layout）”
- “滚动框（Slidebox）”
- “滚动条（Slider）”
- “选项卡（Tabbar）”
- “开关（Toggle）”
- “开关组（Togglegroup）”
- “提示框（Tooltip）”
下面是日历标签的样子：
<x-calendar></x-calendar>
Google 非常信任 Web 组件，它也正在开发一个名为 Polymer 的 Web 组件 polyfill 库，该库试图在现有的浏览器基本结构上充分利用“影子 DOM（Shadow DOM）”、“自定义元素（Custom Elements）”和“模型驱动视图（Model Driven Vies）”等未来技术。
值得一提的是，虽然在过去的一年里 Web 组件的发展势头看上去很好，但是 Web 组件规范变化很快，还有许多方面不确定。几周前，来自 Google 的 Dimitri Glazkov 在 W3C 邮件列表中提议，从规范中删除
像 x-tags 和 polymer 这样的项目，甚至是像 Ember 和 Angular 这样的项目，要给他们机会，让他们带头提出那些问题并帮忙给出具有潜在竞争力的答案——在我看来，没有必要急于在这一点上进行高层次的标准化。
查看英文原文： Mozilla Brick: A Polyfill Library for Web Components
公众号推荐：
跳进 AI 的奇妙世界，一起探索未来工作的新风貌！想要深入了解 AI 如何成为产业创新的新引擎？好奇哪些城市正成为 AI 人才的新磁场？《中国生成式 AI 开发者洞察 2024》由 InfoQ 研究中心精心打造，为你深度解锁生成式 AI 领域的最新开发者动态。无论你是资深研发者，还是对生成式 AI 充满好奇的新手，这份报告都是你不可错过的知识宝典。欢迎大家扫码关注「AI前线」公众号，回复「开发者洞察」领取。
评论