Bug 1505750 - Use the Fluent API directly to avoid flicker when resizing the window, r=gandalf.
authorFlorian Quèze <florian@queze.net>
Thu, 13 Dec 2018 14:17:15 +0100
changeset 450377 69de0ff59928c55b8dbcd4ddbe6d2b3a46f5283f
parent 450376 aa7d7dcdb4e3edc3a5c364e109554b89e45cf643
child 450378 ba6a8e3b071640c50600884501c6266aa0393991
push id110483
push userflorian@queze.net
push dateThu, 13 Dec 2018 13:17:35 +0000
treeherdermozilla-inbound@69de0ff59928 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersgandalf
bugs1505750
milestone66.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1505750 - Use the Fluent API directly to avoid flicker when resizing the window, r=gandalf.
toolkit/components/aboutperformance/content/aboutPerformance.js
--- a/toolkit/components/aboutperformance/content/aboutPerformance.js
+++ b/toolkit/components/aboutperformance/content/aboutPerformance.js
@@ -1018,19 +1018,23 @@ var View = {
         cachedElements[name] = elt;
       }
     }
 
     return cachedElements;
   },
 
   _fragment: document.createDocumentFragment(),
-  commit() {
+  async commit() {
     let tbody = document.getElementById("dispatch-tbody");
 
+    // Force translation to happen before we insert the new content in the DOM
+    // to avoid flicker when resizing.
+    await document.l10n.translateFragment(this._fragment);
+
     while (tbody.firstChild)
       tbody.firstChild.remove();
     tbody.appendChild(this._fragment);
     this._fragment = document.createDocumentFragment();
   },
   insertAfterRow(row) {
     row.parentNode.insertBefore(this._fragment, row.nextSibling);
     this._fragment = document.createDocumentFragment();
@@ -1224,16 +1228,18 @@ var Control = {
       for (let category of ["webpages"]) {
         await wait(0);
         await View.updateCategory(state[category], category, category, mode);
       }
       await wait(0);
 
       // Make sure that we do not keep obsolete stuff around.
       View.DOMCache.trimTo(state.deltas);
+
+      await wait(0);
     } else {
       // If the mouse has been moved recently, update the data displayed
       // without moving any item to avoid the risk of users clicking an action
       // button for the wrong item.
       // Memory use is unlikely to change dramatically within a few seconds, so
       // it's probably fine to not update the Memory column in this case.
       if (Date.now() - this._lastMouseEvent < TIME_BEFORE_SORTING_AGAIN) {
         let energyImpactPerId = new Map();
@@ -1313,21 +1319,19 @@ var Control = {
 
         elt.insertBefore(img, elt.firstChild);
 
         row._children = children;
         if (open)
           this._showChildren(row);
       }
 
-      View.commit();
+      await View.commit();
     }
 
-    await wait(0);
-
     // Inform watchers
     Services.obs.notifyObservers(null, UPDATE_COMPLETE_TOPIC, mode);
   },
   _showChildren(row) {
     let children = row._children;
     children.sort((a, b) => b.dispatchesSincePrevious - a.dispatchesSincePrevious);
     for (let row of children) {
       let host = row.host.replace(/^blob:https?:\/\//, "");