
<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"></head><body style="word-wrap: break-word; -webkit-nbsp-mode: space; line-break: after-white-space;" class=""><div style="line-height: 1.38; margin-top: 0pt; margin-bottom: 0pt;" class=""><div style="line-height: 1.38; margin-top: 0pt; margin-bottom: 0pt;" class="">Removing XUL has been talked about for a long time, but I think it means different things to different people. Since I’ve spent some time working on XUL-related projects I’m going to summarize what it means to me as a way to share what’s currently planned and to get feedback.</div><div style="line-height: 1.38; margin-top: 0pt; margin-bottom: 0pt;" class=""><br class=""></div><div style="line-height: 1.38; margin-top: 0pt; margin-bottom: 0pt;" class=""><span style="white-space: pre-wrap;" class="">XUL is a collection of technologies, so there isn’t going to be a single project that “removes XUL”. What we’d like to do is align browser chrome development more closely with web development, and to simplify Gecko by focusing on the web platform. Each of the projects below should get us a step closer to that, and each has its own priority and timeline.</span></div><br class=""><div style="line-height: 1.38; margin-top: 0pt; margin-bottom: 0pt;" class=""><span style="font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; vertical-align: baseline; white-space: pre-wrap;" class="">One of the successes of XUL is that some of the good parts are now part of the web platform. For those features, “removal” looks like a migration to the standard. Once the old feature isn’t used anymore in chrome, we intend to remove the platform feature (and may remove parts of it along the way as those parts become unused).</span></div><br class=""><ul style="margin-top:0pt;margin-bottom:0pt;" class=""><li dir="ltr" style="list-style-type: disc; font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; vertical-align: baseline; white-space: pre;" class=""><div style="line-height: 1.38; margin-top: 0pt; margin-bottom: 0pt;" class=""><span style="font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; vertical-align: baseline; white-space: pre-wrap;" class="">XBL bindings can be replaced with ‘webbier' alternatives like Web Components or plain JS. It’s a large project, and we are actively working on removing bindings from the frontend and supporting Web Components in the platform (</span><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1397874" style="text-decoration:none;" class=""><span style="color: rgb(17, 85, 204); font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; text-decoration: underline; -webkit-text-decoration-skip: none; vertical-align: baseline; white-space: pre-wrap;" class="">metabug</span></a><span style="font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; vertical-align: baseline; white-space: pre-wrap;" class="">, </span><a href="https://arewexblstill.com/" style="text-decoration:none;" class=""><span style="color: rgb(17, 85, 204); font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; text-decoration: underline; -webkit-text-decoration-skip: none; vertical-align: baseline; white-space: pre-wrap;" class="">tracking dashboard</span></a><span style="font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; vertical-align: baseline; white-space: pre-wrap;" class="">).</span></div></li><li dir="ltr" style="list-style-type: disc; font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; vertical-align: baseline; white-space: pre;" class=""><div style="line-height: 1.38; margin-top: 0pt; margin-bottom: 0pt;" class=""><span style="font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; vertical-align: baseline; white-space: pre-wrap;" class="">XUL flexbox can now be emulated as CSS flexbox. You can try `./mach run --setpref layout.css.emulate-moz-box-with-flex=true` to see how it looks. The main work to do now is to improve performance on CSS flexbox to get to parity on the TART test. That perf work is mostly unassigned - if you’d like to help with this project please get in touch or take a look at the perf metabug (</span><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1033225" style="text-decoration:none;" class=""><span style="color: rgb(17, 85, 204); font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; text-decoration: underline; -webkit-text-decoration-skip: none; vertical-align: baseline; white-space: pre-wrap;" class="">emulation metabug</span></a><span style="font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; vertical-align: baseline; white-space: pre-wrap;" class="">, </span><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1304473" style="text-decoration:none;" class=""><span style="color: rgb(17, 85, 204); font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; text-decoration: underline; -webkit-text-decoration-skip: none; vertical-align: baseline; white-space: pre-wrap;" class="">perf metabug</span></a><span style="font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; vertical-align: baseline; white-space: pre-wrap;" class="">).</span></div></li></ul><br class=""><div style="line-height: 1.38; margin-top: 0pt; margin-bottom: 0pt;" class=""><span style="font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; vertical-align: baseline; white-space: pre-wrap;" class="">Other features will be removed and not replaced:</span></div><br class=""><ul style="margin-top:0pt;margin-bottom:0pt;" class=""><li dir="ltr" style="list-style-type: disc; font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; vertical-align: baseline; white-space: pre;" class=""><div style="line-height: 1.38; margin-top: 0pt; margin-bottom: 0pt;" class=""><span style="font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; vertical-align: baseline; white-space: pre-wrap;" class="">XUL Overlays are no longer necessary for supporting XUL addons and we can simplify a bunch of things by moving away from them. This is actively being worked on, and we expect to be able to remove platform support in a matter of weeks (</span><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1426763" style="text-decoration:none;" class=""><span style="color: rgb(17, 85, 204); font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; text-decoration: underline; -webkit-text-decoration-skip: none; vertical-align: baseline; white-space: pre-wrap;" class="">metabug</span></a><span style="font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; vertical-align: baseline; white-space: pre-wrap;" class="">).</span></div></li><li dir="ltr" style="list-style-type: disc; font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; vertical-align: baseline; white-space: pre;" class=""><div style="line-height: 1.38; margin-top: 0pt; margin-bottom: 0pt;" class=""><span style="font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; vertical-align: baseline; white-space: pre-wrap;" class="">XUL Templates were removed at the beginning of 2018. There was only one consumer on the frontend which got replaced with simpler JS, and the platform support (around 40K LOC) was removed as well (</span><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1425356" style="text-decoration:none;" class=""><span style="color: rgb(17, 85, 204); font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; text-decoration: underline; -webkit-text-decoration-skip: none; vertical-align: baseline; white-space: pre-wrap;" class="">bug</span></a><span style="font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; vertical-align: baseline; white-space: pre-wrap;" class="">).</span></div></li></ul><br class=""><div style="line-height: 1.38; margin-top: 0pt; margin-bottom: 0pt;" class=""><span style="font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; vertical-align: baseline; white-space: pre-wrap;" class="">There is another set of features in XUL that aren’t part of the web platform but also provide functionality that can’t be removed without a replacement that works in chrome HTML. For example:</span></div><br class=""><ul style="margin-top:0pt;margin-bottom:0pt;" class=""><li dir="ltr" style="list-style-type: disc; font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; vertical-align: baseline; white-space: pre;" class=""><div style="line-height: 1.38; margin-top: 0pt; margin-bottom: 0pt;" class=""><span style="font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; vertical-align: baseline; white-space: pre-wrap;" class="">Localization via external DTD files. There are a bunch of reasons why we are transitioning the localization infrastructure to use Project Fluent, including that DTDs are tied to the XML parser and can’t be used from HTML. This work is actively happening, currently focused on strings in <a href="about:preferences" class="">about:preferences</a> but planned to expand across the browser chrome in coming quarters (</span><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1365426" style="text-decoration:none;" class=""><span style="color: rgb(17, 85, 204); font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; text-decoration: underline; -webkit-text-decoration-skip: none; vertical-align: baseline; white-space: pre-wrap;" class="">metabug</span></a><span style="font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; vertical-align: baseline; white-space: pre-wrap;" class="">, </span><a href="http://projectfluent.org/" style="text-decoration:none;" class=""><span style="color: rgb(17, 85, 204); font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; text-decoration: underline; -webkit-text-decoration-skip: none; vertical-align: baseline; white-space: pre-wrap;" class="">fluent homepage</span></a><span style="font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; vertical-align: baseline; white-space: pre-wrap;" class="">).</span></div></li></ul><ul style="margin-top:0pt;margin-bottom:0pt;" class=""><li dir="ltr" style="list-style-type: disc; font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; vertical-align: baseline; white-space: pre;" class=""><div style="line-height: 1.38; margin-top: 0pt; margin-bottom: 0pt;" class=""><span style="font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; vertical-align: baseline; white-space: pre-wrap;" class="">Generating native menus and popups. This is in the planning phase.</span></div></li><li dir="ltr" style="list-style-type: disc; font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; vertical-align: baseline; white-space: pre;" class=""><div style="line-height: 1.38; margin-top: 0pt; margin-bottom: 0pt;" class=""><span style="font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; vertical-align: baseline; white-space: pre-wrap;" class="">Supporting special tags like <browser> and <tree> (and many more). This is in the planning phase.</span></div></li><li dir="ltr" style="list-style-type: disc; font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; vertical-align: baseline; white-space: pre;" class=""><div style="line-height: 1.38; margin-top: 0pt; margin-bottom: 0pt;" class=""><span style="font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; vertical-align: baseline; white-space: pre-wrap;" class="">Extra features that make the application tick, like XULStore and fastload. This is in the planning phase.</span></div></li></ul><br class=""><div style="line-height: 1.38; margin-top: 0pt; margin-bottom: 0pt;" class=""><span style="font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; vertical-align: baseline; white-space: pre-wrap;" class="">Much of that work is still being planned, so there aren’t a lot of specifics to report. Features that are blocking the ability to load a top-level HTML window, or that are blocking other work like XBL removal will get prioritized above others.</span></div><div style="line-height: 1.38; margin-top: 0pt; margin-bottom: 0pt;" class=""><span style="font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; vertical-align: baseline; white-space: pre-wrap;" class=""><br class=""></span></div><div style="line-height: 1.38; margin-top: 0pt; margin-bottom: 0pt;" class=""><span style="font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; vertical-align: baseline; white-space: pre-wrap;" class="">Thanks,</span></div><div style="line-height: 1.38; margin-top: 0pt; margin-bottom: 0pt;" class=""><span style="font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; vertical-align: baseline; white-space: pre-wrap;" class="">Brian</span></div><div style="line-height: 1.38; margin-top: 0pt; margin-bottom: 0pt;" class=""><span style="font-variant-ligatures: normal; font-variant-east-asian: normal; font-variant-position: normal; vertical-align: baseline; white-space: pre-wrap;" class=""><br class=""></span></div></div></body></html>