DevTools: unify Network & CPU throttling

third_party/WebKit/Source/devtools/front_end/timeline/TimelinePanel.js

 /*
  * Copyright (C) 2012 Google Inc. All rights reserved.
  * Copyright (C) 2012 Intel Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions are
  * met:
  *
  *     * Redistributions of source code must retain the above copyright
  * notice, this list of conditions and the following disclaimer.
@@ skipping 59 matching lines @@
       this._filters.push(new TimelineModel.ExcludeTopLevelFilter());
     }
     if (!Runtime.experiments.isEnabled('timelinePaintTimingMarkers'))
       this._filters.push(Timeline.TimelineUIUtils.paintEventsFilter());
 
     /** @type {?Timeline.PerformanceModel} */
     this._performanceModel = null;
     /** @type {?Timeline.PerformanceModel} */
     this._pendingPerformanceModel = null;
 
-    this._cpuThrottlingManager = new MobileThrottling.CPUThrottlingManager();
-
     this._viewModeSetting =
         Common.settings.createSetting('timelineViewMode', Timeline.TimelinePanel.ViewMode.FlameChart);
 
     this._disableCaptureJSProfileSetting = Common.settings.createSetting('timelineDisableJSSampling', false);
     this._disableCaptureJSProfileSetting.setTitle(Common.UIString('Disable JavaScript samples'));
     this._captureLayersAndPicturesSetting = Common.settings.createSetting('timelineCaptureLayersAndPictures', false);
     this._captureLayersAndPicturesSetting.setTitle(Common.UIString('Enable advanced paint instrumentation (slow)'));
 
     this._showScreenshotsSetting = Common.settings.createSetting('timelineShowScreenshots', true);
     this._showScreenshotsSetting.setTitle(Common.UIString('Screenshots'));
@@ skipping 158 matching lines @@
     this._panelToolbar.appendSeparator();
     this._panelToolbar.appendToolbarItem(this._showSettingsPaneButton);
   }
 
   _createSettingsPane() {
     this._showSettingsPaneSetting = Common.settings.createSetting('timelineShowSettingsToolbar', false);
     this._showSettingsPaneButton = new UI.ToolbarSettingToggle(
         this._showSettingsPaneSetting, 'largeicon-settings-gear', Common.UIString('Capture settings'));
     SDK.multitargetNetworkManager.addEventListener(
         SDK.MultitargetNetworkManager.Events.ConditionsChanged, this._updateShowSettingsToolbarButton, this);
-    this._cpuThrottlingManager.addEventListener(
-        MobileThrottling.CPUThrottlingManager.Events.RateChanged, this._updateShowSettingsToolbarButton, this);
     this._disableCaptureJSProfileSetting.addChangeListener(this._updateShowSettingsToolbarButton, this);
     this._captureLayersAndPicturesSetting.addChangeListener(this._updateShowSettingsToolbarButton, this);
 
     this._settingsPane = new UI.HBox();
     this._settingsPane.element.classList.add('timeline-settings-pane');
     this._settingsPane.show(this.element);
 
     var captureToolbar = new UI.Toolbar('', this._settingsPane.element);
     captureToolbar.element.classList.add('flex-auto');
     captureToolbar.makeVertical();
     captureToolbar.appendToolbarItem(this._createSettingCheckbox(
         this._disableCaptureJSProfileSetting,
         Common.UIString('Disables JavaScript sampling, reduces overhead when running against mobile devices')));
     captureToolbar.appendToolbarItem(this._createSettingCheckbox(
         this._captureLayersAndPicturesSetting,
         Common.UIString('Captures advanced paint instrumentation, introduces significant performance overhead')));
 
     var throttlingPane = new UI.VBox();
     throttlingPane.element.classList.add('flex-auto');
     throttlingPane.show(this._settingsPane.element);
 
-    var throttlingToolbar1 = new UI.Toolbar('', throttlingPane.element);
-    throttlingToolbar1.appendText(Common.UIString('Network:'));
-    throttlingToolbar1.appendToolbarItem(this._createNetworkConditionsSelect());
-    var throttlingToolbar2 = new UI.Toolbar('', throttlingPane.element);
-    throttlingToolbar2.appendText(Common.UIString('CPU:'));
-    throttlingToolbar2.appendToolbarItem(this._cpuThrottlingManager.createControl());
+    var throttlingToolbar = new UI.Toolbar('', throttlingPane.element);
+    throttlingToolbar.appendText(Common.UIString('Throttling:'));
+    throttlingToolbar.appendToolbarItem(this._createThrottlingSelect());
+    this._throttlingSelector.addEventListener(
+        MobileThrottling.Events.CPURateChanged, this._updateShowSettingsToolbarButton, this);

[dgozman, 2017/06/13 01:47:08]

You actually want to update not only on cpu throttling, but on any non-default
value.

[chenwilliam, 2017/06/13 21:54:52]

So I'm tracking the network throttling changes in L256. I had bump down this CPU
event listener because I don't instantiate throttlingSelector until L281.
Doesn't feel great :S

[dgozman, 2017/06/13 23:18:39]

Let's have a single event and update only once. If you have a control with
event, you should not skip a layer and listen to underlying model.

 
     this._showSettingsPaneSetting.addChangeListener(this._updateSettingsPaneVisibility.bind(this));
     this._updateSettingsPaneVisibility();
   }
 
   /**
     * @param {!Common.Event} event
     */
   _appendExtensionsToToolbar(event) {
     var provider = /** @type {!Extensions.ExtensionTraceProvider} */ (event.data);
@@ skipping 13 matching lines @@
       setting = Common.settings.createSetting(providerId, false);
       setting.setTitle(traceProvider.shortDisplayName());
       traceProvider[Timeline.TimelinePanel._traceProviderSettingSymbol] = setting;
     }
     return setting;
   }
 
   /**
    * @return {!UI.ToolbarComboBox}
    */
-  _createNetworkConditionsSelect() {
+  _createThrottlingSelect() {

[dgozman, 2017/06/13 01:47:09]

Inline it.

[chenwilliam, 2017/06/13 21:54:52]

Done.

     var toolbarItem = new UI.ToolbarComboBox(null);
-    toolbarItem.setMaxWidth(140);
-    MobileThrottling.NetworkConditionsSelector.decorateSelect(toolbarItem.selectElement());
+    toolbarItem.setMaxWidth(160);
+    this._throttlingSelector = MobileThrottling.ThrottlingSelector.decorateSelect(toolbarItem.selectElement());
     return toolbarItem;
   }
 
   _prepareToLoadTimeline() {
     console.assert(this._state === Timeline.TimelinePanel.State.Idle);
     this._setState(Timeline.TimelinePanel.State.Loading);
     this._pendingPerformanceModel = new Timeline.PerformanceModel();
   }
 
   _createFileSelector() {
@@ skipping 155 matching lines @@
 
   _updateSettingsPaneVisibility() {
     if (this._showSettingsPaneSetting.get())
       this._settingsPane.showWidget();
     else
       this._settingsPane.hideWidget();
   }
 
   _updateShowSettingsToolbarButton() {
     var messages = [];
-    if (this._cpuThrottlingManager.rate() !== 1)
+    if (this._throttlingSelector.cpuThrottlingRate() !== 1)
       messages.push(Common.UIString('- CPU throttling is enabled'));
     if (SDK.multitargetNetworkManager.isThrottling())
       messages.push(Common.UIString('- Network throttling is enabled'));
     if (this._captureLayersAndPicturesSetting.get())
       messages.push(Common.UIString('- Significant overhead due to paint instrumentation'));
     if (this._disableCaptureJSProfileSetting.get())
       messages.push(Common.UIString('- JavaScript sampling is disabled'));
 
     this._showSettingsPaneButton.setDefaultWithRedColor(messages.length);
     this._showSettingsPaneButton.setToggleWithRedColor(messages.length);
@@ skipping 857 matching lines @@
         return true;
       case 'timeline.show-history':
         panel._showHistory();
         return true;
     }
     return false;
   }
 };
 
 Timeline.TimelinePanel._traceProviderSettingSymbol = Symbol('traceProviderSetting');