<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 class="entry"><p class="">This is the fifth edition of the XBL Replacement Newsletter.
Since the last update we’ve moved below 200 bindings, so we’ve removed
just over one third of the bindings. We’ve also been making progress on
in-content bindings and doing some cleanup that’s been enabled by the
work so far. The easiest way to follow along with this work is to watch
the main <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1397874" class="">meta bug</a>.</p>
<h2 id="in-content-xbl" class=""><span style="font-size: 12px;" class="">In Content XBL</span></h2><p class="">Stopping use of XBL in the content process will be a big milestone
for the project, and it’ll let us remove a lot of complexity that exists
to make these elements secure. We’ve come up with an outline for how to
replace in-content bindings that require DOM/JS in the content process:
the basic idea is to use a “User Agent” Shadow DOM that’s only
accessible to chrome code and to run the JS in a new limited privileged
scope. You can see a more <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1431255#c11" class="">detailed proposal</a> on the bug.</p><p class="">In addition to this, we’ve been <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1443836" class="">making progress</a> on removing and simplifying the current in-content bindings:</p>
<ul class="">
<li class="">We no longer use XBL for scrollbars! Tim <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1450017" class="">removed the <code class="highlighter-rouge">scrollbar</code> binding</a>, and we instead build up native anonymous content to render them. This unblocks <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=645563" class="">further improvements</a> such as using a single element instead of a full DOM tree for scrollbars.</li>
<li class="">The “resizer” is the little grippy icon that shows up on the corner of textareas to let you resize them. Tim <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1450017" class="">removed the <code class="highlighter-rouge">resizer</code> binding</a> and we now use native anonymous content instead.</li>
<li class=""><code class="highlighter-rouge">touchControls</code> and <code class="highlighter-rouge">suppressChangeEvent</code> were separate bindings for mobile that extended the <code class="highlighter-rouge">videocontrols</code> binding. Tim <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1444489" class="">removed them</a> and now we now share a single binding with different styling for mobile.</li>
<li class="">XML pretty printing used to require JS to expand and collapse tags. Ian Moody <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1432636" class="">changed this</a> by rendering the tree with HTML <code class="highlighter-rouge"><details></code> and <code class="highlighter-rouge"><summary></code> tags instead. We still use a XBL binding to mount the content into the page, but there’s a <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1437956" class="">bug on file</a> to stop doing that.</li>
</ul>
<h2 id="cleanup" class=""><span style="font-size: 12px;" class="">Cleanup</span></h2>
<ul class="">
<li class="">There was a feature called <code class="highlighter-rouge">NODE_FORCE_XBL_BINDINGS</code>
that would eagerly attach XBL to a cloned node even before it was added
to the DOM. We no longer rely on that feature, so it was <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1443948" class="">removed</a>.</li>
<li class="">We no longer load xul.css in content documents. This used to get loaded when we rendered <code class="highlighter-rouge">touchControls</code>, among other things. We still load minimal-xul.css in all content documents, but there’s a new metabug tracking removal of <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1446829" class="">in-content xul</a> to ratchet this down.</li>
<li class="">We’ve been removing nsIDOMXUL* stuff, which also aligns with :bz’s work to remove nsIDOM* stuff. We removed <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1456682" class=""><code class="highlighter-rouge">nsIDOMXULTreeElement</code></a>, <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1456703" class=""><code class="highlighter-rouge">nsIDOMXULTextBoxElement</code></a>, and everything but one attribute from <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1455433" class=""><code class="highlighter-rouge">nsIDOMXULCheckboxElement</code></a>.</li>
<li class="">Neil <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1446961" class="">simplified the XBL implementation</a> of popups by allowing <code class="highlighter-rouge">nsXULElement</code> to be subclassed and then using a subclass for <code class="highlighter-rouge">menupopup</code>, <code class="highlighter-rouge">popup</code>, <code class="highlighter-rouge">panel</code>, and <code class="highlighter-rouge">tooltip</code> elements.</li>
<li class="">There have been some nice cleanups to the gBrowser object since
migrating away from XBL. Dão did a bunch of refactoring, which can be
seen in bugs inside the ‘Blocks’ field of <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1392352" class="">the JS migration bug</a>. We also saw a tabpaint perf win when <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1442651#c28" class="">deleting the tabbrowser binding</a>.</li>
</ul>
<h2 id="binding-removals" class=""><span style="font-size: 12px;" class="">Binding Removals</span></h2><p class="">There are <a href="https://bgrins.github.io/xbl-analysis/#timeline" class="">196 more bindings left</a>, compared to 215 from the last update and 300 from the start of the project. Here’s a list of changes:</p>
<ul class="">
<li class="">Dão <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1453281" class="">removed the <code class="highlighter-rouge">menubar</code> binding</a> and cleaned up some redundant styling in the meantime.</li>
<li class="">Dão also <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1444891" class="">removed the <code class="highlighter-rouge">statuspanel</code> binding</a>, by moving the implementation into a plain JS object inside tabbrowser.js.</li>
<li class="">Edouard Oger <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1453958" class="">removed the <code class="highlighter-rouge">menulist-base</code> binding</a>, by loading the CSS file inside of components.css instead of with XBL <code class="highlighter-rouge"><resources></code>.</li>
<li class="">I <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1455392" class="">removed the <code class="highlighter-rouge">sorters</code> binding</a> used in <a href="about:addons" class="">about:addons</a> in order to unblock simplification of nsIDOMXULCheckboxElement.</li>
<li class="">I also <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1420990" class="">removed the <code class="highlighter-rouge">container</code> binding</a> from <a href="about:preferences" class="">about:preferences</a>, using a normal <code class="highlighter-rouge"><richlistitem></code> instead.</li>
<li class="">I also <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1448215" class="">removed the <code class="highlighter-rouge">offlineapp</code> binding</a>, which was unused.</li>
<li class="">Paolo <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1452624" class="">removed the <code class="highlighter-rouge">filefield</code> binding</a> by using a normal <code class="highlighter-rouge"><textbox></code> with custom styling.</li>
<li class="">Paolo also <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1451408" class="">removed the <code class="highlighter-rouge">button-repeat</code> binding</a>, which was unused.</li>
<li class="">Paolo also <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1434860" class="">removed the <code class="highlighter-rouge">toolbarbutton-menu-button</code> binding</a>, which was unused.</li>
<li class="">Potch <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1446163" class="">removed the <code class="highlighter-rouge">splitter</code> binding</a>, by loading the CSS file inside of components.css instead of with XBL <code class="highlighter-rouge"><resources></code>.</li>
<li class="">Tim removed a bunch of in-content bindings: <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1431246" class=""><code class="highlighter-rouge">scrollbar</code></a>, <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1444489" class=""><code class="highlighter-rouge">suppressChangeEvent</code></a>, <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1444489" class=""><code class="highlighter-rouge">touchControls</code></a>, and <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1450017" class=""><code class="highlighter-rouge">resizer</code></a>.</li>
<li class="">Tim also <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1446157" class="">removed the <code class="highlighter-rouge">grippy</code> binding</a>, which was unused.</li>
<li class="">Tim also <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1446009" class="">removed the <code class="highlighter-rouge">groupbox-base</code> binding</a> by loading the CSS inside of components.css instead of with XBL <code class="highlighter-rouge"><resources></code>.</li>
</ul><div class=""><br class=""></div></div></body></html>