DevTools: TabbedLocations only materialize tabs when needed

third_party/WebKit/Source/devtools/front_end/ui/View.js

 // Copyright 2016 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 /**
  * @interface
  */
 UI.View = function() {};
 
 UI.View.prototype = {
   /**
@@ skipping 560 matching lines @@
 
     super(manager, tabbedPane, revealCallback);
     this._tabbedPane = tabbedPane;
     this._allowReorder = allowReorder;
 
     this._tabbedPane.addEventListener(UI.TabbedPane.Events.TabSelected, this._tabSelected, this);
     this._tabbedPane.addEventListener(UI.TabbedPane.Events.TabClosed, this._tabClosed, this);
     this._closeableTabSetting = Common.settings.createSetting(location + '-closeableTabs', {});
     this._tabOrderSetting = Common.settings.createSetting(location + '-tabOrder', {});
     this._tabbedPane.addEventListener(UI.TabbedPane.Events.TabOrderChanged, this._persistTabOrder, this);
+    this._tabbedPane.addEventListener(UI.TabbedPane.Events.TabsShown, this._tabsShown, this);
     if (restoreSelection)
       this._lastSelectedTabSetting = Common.settings.createSetting(location + '-selectedTab', '');
     this._defaultTab = defaultTab;
 
     /** @type {!Map.<string, !UI.View>} */
     this._views = new Map();
 
     if (location)
       this.appendApplicableItems(location);
   }
@@ skipping 139 matching lines @@
    * @param {!Common.Event} event
    */
   _tabSelected(event) {
     var tabId = /** @type {string} */ (event.data.tabId);
     if (this._lastSelectedTabSetting && event.data['isUserGesture'])
       this._lastSelectedTabSetting.set(tabId);
     var view = this._views.get(tabId);
     if (!view)
       return;
 
-    this._materializeWidget(view);
+    if (this._tabbedPane.isShowing())
+      this._materializeWidget(view);
 
     if (view.isCloseable()) {
       var tabs = this._closeableTabSetting.get();
       if (!tabs[tabId]) {
         tabs[tabId] = true;
         this._closeableTabSetting.set(tabs);
       }
     }
   }
 
   /**
    * @param {!Common.Event} event
    */
+  _tabsShown(event) {

[dgozman, 2017/01/10 21:51:45]

We can instead materialize when our wrapper (UI.ViewManager._ContainerWidget)
was shown.

[luoe, 2017/01/10 23:15:17]

Brilliant idea

+    var view = event.data ? this._views.get(event.data.id) : null;
+    if (!view)
+      return;
+    this._materializeWidget(view);
+  }
+
+  /**
+   * @param {!Common.Event} event
+   */
   _tabClosed(event) {
     var id = /** @type {string} */ (event.data['tabId']);
     var tabs = this._closeableTabSetting.get();
     if (tabs[id]) {
       delete tabs[id];
       this._closeableTabSetting.set(tabs);
     }
   }
 
   /**
@@ skipping 96 matching lines @@
   appendApplicableItems(locationName) {
     for (var view of this._manager._viewsForLocation(locationName))
       this.appendView(view);
   }
 };
 
 /**
  * @type {!UI.ViewManager}
  */
 UI.viewManager;