Bug 1383367: Part 3 - Defer getComputedStyle call if a reflow is currently pending. r=mconley
☠☠ backed out by 7051e8c01179 ☠ ☠
authorKris Maglione <maglione.k@gmail.com>
Wed, 26 Jul 2017 14:30:00 -0700
changeset 420569 ecaae0733ca1dc08db7e8defe5c572f8d708d8a6
parent 420568 9c966265dc4834242369f56bf7bac91abf44998e
child 420570 d7a49fecc6b9a164c145ea664015e9792f62d050
push id7566
push usermtabara@mozilla.com
push dateWed, 02 Aug 2017 08:25:16 +0000
treeherdermozilla-beta@86913f512c3c [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersmconley
bugs1383367
milestone56.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 1383367: Part 3 - Defer getComputedStyle call if a reflow is currently pending. r=mconley MozReview-Commit-ID: 33IRfOlaBxP
browser/base/content/browser.js
browser/base/content/test/performance/browser_windowopen_reflows.js
--- a/browser/base/content/browser.js
+++ b/browser/base/content/browser.js
@@ -8712,17 +8712,17 @@ var ToolbarIconColor = {
         break;
     }
   },
 
   // a cache of luminance values for each toolbar
   // to avoid unnecessary calls to getComputedStyle
   _toolbarLuminanceCache: new Map(),
 
-  inferFromText(reason, reasonValue) {
+  async inferFromText(reason, reasonValue) {
     if (!this._initialized)
       return;
     function parseRGB(aColorString) {
       let rgb = aColorString.match(/^rgba?\((\d+), (\d+), (\d+)/);
       rgb.shift();
       return rgb.map(x => parseInt(x));
     }
 
@@ -8749,30 +8749,32 @@ var ToolbarIconColor = {
     let toolbarSelector = "#navigator-toolbox > toolbar:not([collapsed=true]):not(#addon-bar)";
     if (AppConstants.platform == "macosx")
       toolbarSelector += ":not([type=menubar])";
 
     // The getComputedStyle calls and setting the brighttext are separated in
     // two loops to avoid flushing layout and making it dirty repeatedly.
     let cachedLuminances = this._toolbarLuminanceCache;
     let luminances = new Map();
-    for (let toolbar of document.querySelectorAll(toolbarSelector)) {
-      // toolbars *should* all have ids, but guard anyway to avoid blowing up
-      let cacheKey = toolbar.id && toolbar.id + JSON.stringify(this._windowState);
-      // lookup cached luminance value for this toolbar in this window state
-      let luminance = cacheKey && cachedLuminances.get(cacheKey);
-      if (isNaN(luminance)) {
-        let [r, g, b] = parseRGB(getComputedStyle(toolbar).color);
-        luminance = 0.2125 * r + 0.7154 * g + 0.0721 * b;
-        if (cacheKey) {
-          cachedLuminances.set(cacheKey, luminance);
+    await BrowserUtils.promiseLayoutFlushed(document, "style", () => {
+      for (let toolbar of document.querySelectorAll(toolbarSelector)) {
+        // toolbars *should* all have ids, but guard anyway to avoid blowing up
+        let cacheKey = toolbar.id && toolbar.id + JSON.stringify(this._windowState);
+        // lookup cached luminance value for this toolbar in this window state
+        let luminance = cacheKey && cachedLuminances.get(cacheKey);
+        if (isNaN(luminance)) {
+          let [r, g, b] = parseRGB(getComputedStyle(toolbar).color);
+          luminance = 0.2125 * r + 0.7154 * g + 0.0721 * b;
+          if (cacheKey) {
+            cachedLuminances.set(cacheKey, luminance);
+          }
         }
+        luminances.set(toolbar, luminance);
       }
-      luminances.set(toolbar, luminance);
-    }
+    });
 
     for (let [toolbar, luminance] of luminances) {
       if (luminance <= 110)
         toolbar.removeAttribute("brighttext");
       else
         toolbar.setAttribute("brighttext", "true");
     }
   }
--- a/browser/base/content/test/performance/browser_windowopen_reflows.js
+++ b/browser/base/content/test/performance/browser_windowopen_reflows.js
@@ -27,29 +27,33 @@ if (Services.appinfo.OS == "Linux") {
         "handleEvent@chrome://browser/content/tabbrowser.xml",
         "EventListener.handleEvent*tabbrowser-tabs_XBL_Constructor@chrome://browser/content/tabbrowser.xml",
       ],
     );
   } else {
     EXPECTED_REFLOWS.push(
       [
         "handleEvent@chrome://browser/content/tabbrowser.xml",
-        "inferFromText@chrome://browser/content/browser.js",
-        "handleEvent@chrome://browser/content/browser.js",
+        "inferFromText/<@chrome://browser/content/browser.js",
+        "promiseReflowed/</<@resource://gre/modules/BrowserUtils.jsm",
+        "_onReflow@resource://gre/modules/BrowserUtils.jsm",
+        "reflowInterruptible@resource://gre/modules/BrowserUtils.jsm",
       ],
     );
   }
 }
 
 if (Services.appinfo.OS == "Darwin") {
   EXPECTED_REFLOWS.push(
     [
       "handleEvent@chrome://browser/content/tabbrowser.xml",
-      "inferFromText@chrome://browser/content/browser.js",
-      "handleEvent@chrome://browser/content/browser.js",
+      "inferFromText/<@chrome://browser/content/browser.js",
+      "promiseReflowed/</<@resource://gre/modules/BrowserUtils.jsm",
+      "_onReflow@resource://gre/modules/BrowserUtils.jsm",
+      "reflowInterruptible@resource://gre/modules/BrowserUtils.jsm",
     ],
   );
 }
 
 if (Services.appinfo.OS == "WINNT") {
   EXPECTED_REFLOWS.push(
     [
       "verticalMargins@chrome://browser/content/browser-tabsintitlebar.js",
@@ -62,18 +66,20 @@ if (Services.appinfo.OS == "WINNT") {
       "verticalMargins@chrome://browser/content/browser-tabsintitlebar.js",
       "_update@chrome://browser/content/browser-tabsintitlebar.js",
       "updateAppearance@chrome://browser/content/browser-tabsintitlebar.js",
       "handleEvent@chrome://browser/content/tabbrowser.xml",
     ],
 
     [
       "handleEvent@chrome://browser/content/tabbrowser.xml",
-      "inferFromText@chrome://browser/content/browser.js",
-      "handleEvent@chrome://browser/content/browser.js",
+      "inferFromText/<@chrome://browser/content/browser.js",
+      "promiseReflowed/</<@resource://gre/modules/BrowserUtils.jsm",
+      "_onReflow@resource://gre/modules/BrowserUtils.jsm",
+      "reflowInterruptible@resource://gre/modules/BrowserUtils.jsm",
     ],
 
     [
       "handleEvent@chrome://browser/content/tabbrowser.xml",
       "EventListener.handleEvent*tabbrowser-tabs_XBL_Constructor@chrome://browser/content/tabbrowser.xml",
     ],
   );
 }