Bug 1500717 - Parallelize the toolbox loading the inspector's iframe and initializing the inspector. r=pbro
☠☠ backed out by 97b682ea485d ☠ ☠
authorGabriel Luong <gabriel.luong@gmail.com>
Mon, 22 Oct 2018 12:20:58 -0400
changeset 490652 6cd064e0fbd922ac0e590bbf3dcaad902469303a
parent 490649 d0bb57076f0a08fd2f73e9d0d6728ebc91c231d0
child 490653 4fbd733460be88a0a587ec5a4d10945bf2df9e8c
push id247
push userfmarier@mozilla.com
push dateSat, 27 Oct 2018 01:06:44 +0000
reviewerspbro
bugs1500717
milestone64.0a1
Bug 1500717 - Parallelize the toolbox loading the inspector's iframe and initializing the inspector. r=pbro
devtools/client/framework/toolbox.js
--- a/devtools/client/framework/toolbox.js
+++ b/devtools/client/framework/toolbox.js
@@ -3,16 +3,17 @@
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
 "use strict";
 
 const SOURCE_MAP_WORKER = "resource://devtools/client/shared/source-map/worker.js";
 const SOURCE_MAP_WORKER_ASSETS = "resource://devtools/client/shared/source-map/assets/";
 
 const MAX_ORDINAL = 99;
+const SHOW_ALL_ANONYMOUS_CONTENT_PREF = "devtools.inspector.showAllAnonymousContent";
 const SPLITCONSOLE_ENABLED_PREF = "devtools.toolbox.splitconsoleEnabled";
 const SPLITCONSOLE_HEIGHT_PREF = "devtools.toolbox.splitconsoleHeight";
 const DISABLE_AUTOHIDE_PREF = "ui.popup.disable_autohide";
 const HOST_HISTOGRAM = "DEVTOOLS_TOOLBOX_HOST";
 const CURRENT_THEME_SCALAR = "devtools.current_theme";
 const HTML_NS = "http://www.w3.org/1999/xhtml";
 
 var {Ci, Cc} = require("chrome");
@@ -1683,17 +1684,17 @@ Toolbox.prototype = {
   /**
    * Ensure the tool with the given id is loaded.
    *
    * @param {string} id
    *        The id of the tool to load.
    */
   loadTool: function(id) {
     if (id === "inspector" && !this._inspector) {
-      return this.initInspector().then(() => this.loadTool(id));
+      this.initInspector();
     }
 
     let iframe = this.doc.getElementById("toolbox-panel-iframe-" + id);
     if (iframe) {
       const panel = this._toolPanels.get(id);
       return new Promise(resolve => {
         if (panel) {
           resolve(panel);
@@ -1727,17 +1728,21 @@ Toolbox.prototype = {
 
       // If no parent yet, append the frame into default location.
       if (!iframe.parentNode) {
         const vbox = this.doc.getElementById("toolbox-panel-" + id);
         vbox.appendChild(iframe);
         vbox.visibility = "visible";
       }
 
-      const onLoad = () => {
+      const onLoad = async () => {
+        if (id === "inspector") {
+          await this._initInspector;
+        }
+
         // Prevent flicker while loading by waiting to make visible until now.
         iframe.style.visibility = "visible";
 
         // Try to set the dir attribute as early as possible.
         this.setIframeDocumentDir(iframe);
 
         // The build method should return a panel instance, so events can
         // be fired with the panel as an argument. However, in order to keep
@@ -2669,32 +2674,43 @@ Toolbox.prototype = {
    */
   initInspector: function() {
     if (!this._initInspector) {
       this._initInspector = (async function() {
         // Temporary fix for bug #1493131 - inspector has a different life cycle
         // than most other fronts because it is closely related to the toolbox.
         // TODO: replace with getFront once inspector is separated from the toolbox
         this._inspector = this.target.getInspector();
-        const pref = "devtools.inspector.showAllAnonymousContent";
-        const showAllAnonymousContent = Services.prefs.getBoolPref(pref);
-        this._walker = await this._inspector.getWalker({ showAllAnonymousContent });
+
+        await Promise.all([
+          this._getWalker(),
+          this._getHighlighter(),
+        ]);
+
         this._selection = new Selection(this._walker);
+
         this._selection.on("new-node-front", this._onNewSelectedNodeFront);
-
         this.walker.on("highlighter-ready", this._highlighterReady);
         this.walker.on("highlighter-hide", this._highlighterHidden);
-
-        const autohide = !flags.testing;
-        this._highlighter = await this._inspector.getHighlighter(autohide);
       }.bind(this))();
     }
     return this._initInspector;
   },
 
+  _getWalker: async function() {
+    const showAllAnonymousContent = Services.prefs.getBoolPref(
+      SHOW_ALL_ANONYMOUS_CONTENT_PREF);
+    this._walker = await this._inspector.getWalker({ showAllAnonymousContent });
+  },
+
+  _getHighlighter: async function() {
+    const autohide = !flags.testing;
+    this._highlighter = await this._inspector.getHighlighter(autohide);
+  },
+
   _onNewSelectedNodeFront: function() {
     // Emit a "selection-changed" event when the toolbox.selection has been set
     // to a new node (or cleared). Currently used in the WebExtensions APIs (to
     // provide the `devtools.panels.elements.onSelectionChanged` event).
     this.emit("selection-changed");
   },
 
   _onInspectObject: function(packet) {