DevTools: TabbedLocations only materialize tabs when needed

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

Index: third_party/WebKit/Source/devtools/front_end/ui/View.js
diff --git a/third_party/WebKit/Source/devtools/front_end/ui/View.js b/third_party/WebKit/Source/devtools/front_end/ui/View.js
index a0eef03dbb35105eaa0eb06bb677515113e6c789..e17e6e3090e82ea793d23a3304b63824716e2fba 100644
--- a/third_party/WebKit/Source/devtools/front_end/ui/View.js
+++ b/third_party/WebKit/Source/devtools/front_end/ui/View.js
@@ -578,6 +578,7 @@ UI.ViewManager._TabbedLocation = class extends UI.ViewManager._Location {
     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;
@@ -737,7 +738,8 @@ UI.ViewManager._TabbedLocation = class extends UI.ViewManager._Location {
     if (!view)
       return;
 
-    this._materializeWidget(view);
+    if (this._tabbedPane.isShowing())
+      this._materializeWidget(view);
 
     if (view.isCloseable()) {
       var tabs = this._closeableTabSetting.get();
@@ -751,6 +753,16 @@ UI.ViewManager._TabbedLocation = class extends UI.ViewManager._Location {
   /**
    * @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();