Firefox UI已迁移至Web Components

这不是一项一蹴而就的工程，Mozilla 开发者表示团队花费了大约两年的时间，采用“增量更新”的方式才逐渐将 Firefox UI 迁移至使用 Web Components 构建。

Mozilla 开发者 Brian Grinstead 在博客宣布，经过多年的努力，他已在几个星期前从 Firefox UI 中移除了 XBL，亦即意味着将 Firefox UI 迁移至使用 Web Components 构建的工程已完成。

XBL 是一种基于 XML 的语言，当我们要实现附加到 DOM 元素的“绑定”就需要使用 XBL。然后，我们还可以将自定义 JS 属性和匿名内容添加到常规元素。XBL 是在90年代末期为 NetScape 设计和构建的，除了 XBL，还有许多其他的“XUL”特性可帮助我们构建桌面 Web 应用 —— 比 Web 平台提供相似的功能早得多。

Firefox 大约有 300 个 XBL 绑定和 50000 行相关代码，主要都是被比较小型的部件使用（如<toolbarbutton label="Reload" />），以及用于管理应用程序（如<tabbrowser />，它通过管理标签在浏览器窗口中控制大部分状态，以及从内容页面接收消息等）。

我们可以将 Firefox UI 看作是一个非常大型的单页应用程序，最初采用 DOM 和 JS 构建，相对于 20 多年前的原生应用，它的技术选型十分大胆。也正因为 Mozilla 走得太超前，所以在 Web 平台尚未支持它们之前就自己实现了构建复杂 Web 应用所需的部分特性。这些特性在日后也逐渐演变成像 CSS flexbox 和 Web Components 这样的标准规范。

处于这种新老交替的时刻，让现有代码库继续使用原版本，并要求平台同时支持两者当然是最容易的，毕竟对旧代码进行重写十分困难而且成本巨大。

然而即便如此，Mozilla 还是选择在 Firefox 中实现 Web Components，他们启动了一个“并行”项目，在该项目中，团队将迁移现有的 UI 组件以使用它们。他们以“增量更新”的方式进行此操作，以便在保证 Firefox 正常运行的同时进行每个独立的更改，而不是从头开始创建一个分支来重写 UI。

Brian 认为这是一项重大的成就，也给 Firefox 的底层提供了改进，还允许团队可以将精力集中在现代 Web 标准上，并移除没有对外公开的大量重复和复杂的功能。

至于为什么要使用 Web Components，Brian 表示由于 XBL 存在的问题，多年来团队一直在讨论移除 XBL。但这项工程似乎十分庞大，并且看起来好像需要从头开始重写 Firefox UI，所以一直没能有效推动项目的进展。

后来团队进行了“设计审查”，并提议启动“并行项目”计划，以实现采用“增量更新”的方式实现迁移的目标。由于两者的模型非常相似，因此开发者在迁移元素时能做出合理的选择，以尽可能保持 API 的兼容性。

Firefox UI已迁移至Web Components相关推荐

Fiori Fundamentals和SAP UI5 Web Components
这周有位同事邀请我给团队讲一讲SAP技术的演进历史,所以我准备了下面几个主题来介绍. 其中SAP的技术回顾和演进,我的思路就是从前后台两方面分别介绍. 我画了一张非常简单的图: 去年5月我写过一篇文章 ...
Web Components 学习 01 认识 Web Components、一些组件库使用
什么是 Web Components 开发项目的时候为什么不手写原生 JS,而是要用现如今非常流行的前端框架,原因有很多,例如: 良好的生态数据驱动试图模块化组件化等 Web Componen ...
从 0 到 1 上手 Web Components 业务组件库开发
组件化是前端发展的一个重要方向,它一方面提高开发效率,另一方面降低维护成本.主流的 Vue.js.React 及其延伸的 Ant Design.uniapp.Taro 等都是组件框架. Web C ...
【总结】- 从 0 到 1 上手 Web Components 业务组件库开发
组件化是前端发展的一个重要方向,它一方面提高开发效率,另一方面降低维护成本.主流的 Vue.js.React 及其延伸的 Ant Design.uniapp.Taro 等都是组件框架.Web Comp ...
【总结】1181- 从 0 到 1 上手 Web Components 业务组件库开发
组件化是前端发展的一个重要方向,它一方面提高开发效率,另一方面降低维护成本.主流的 Vue.js.React 及其延伸的 Ant Design.uniapp.Taro 等都是组件框架.Web Comp ...
Web Components 简述
要说最近几年来,前端开发最火的一个趋势或最火的前端开发框架是什么,第一想到的是,组件及推崇组件化开发的React框架.本文将介绍Web Components规范并就组件的几大特性进行讨论. 前言在开 ...
在ASP.NET中使用Office Web Components (OWC)创建统计图
图形和图表是Web上数据表现的很好的形式,在ASP.NET,可以使用Office Web Components (OWC)来创建统计图.Office Web Component (OWC)是包含在Mi ...
Web Components 上手指南
现在的前端开发基本离不开 React.Vue 这两个框架的支撑,而这两个框架下面又衍生出了许多的自定义组件库: Element(Vue) Ant Design(React) 这些组件库的出现,让我们可 ...
browser.html – HTML 实现 Firefox UI
browser.html 是一个实验性的项目,用于证明一个概念:使用 HTML 重新实现 Firefox UI ,并作为一个应用程序.它是基于浏览器的 API ,并以浏览器的方式和系统的应用工作.即使 ...

Firefox UI已迁移至Web Components

Firefox UI已迁移至Web Components相关推荐

最新文章

热门文章