Web Inspector: CPU Usage Timeline - Adjust Energy Impact Threshholds
authorjoepeck@webkit.org <joepeck@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Mon, 1 Apr 2019 18:54:36 +0000 (18:54 +0000)
committerjoepeck@webkit.org <joepeck@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Mon, 1 Apr 2019 18:54:36 +0000 (18:54 +0000)
https://bugs.webkit.org/show_bug.cgi?id=196421
<rdar://problem/49125703>

Reviewed by Devin Rousso.

- Low - Keep Below 3% to continue to encourage idle pages stay below 3%
  Might want to reduce to 2.5 or 2 after fixing bug 196419.

- High - Make Above 30% instead of 50% to encourage long running interactivity to stay below 30%
  Depends on interaction, but sustained (1-2min) at 30%+ will certainly impact battery.

- Very High - Make above 100% instead of 150%
  CPU Usage spikes around page load and is quite often still under 100% despite many threads.
  Drop this a bit as we dropped High down.

Reduce the size of the Medium section, and increase the High section
Having 70% of the chart be "Medium" is just too much Medium, and
we've now made it more possible to be in the High range.

* UserInterface/Views/CPUTimelineView.js:
(WI.CPUTimelineView.prototype.get mediumEnergyThreshold):
(WI.CPUTimelineView.prototype.get highEnergyThreshold):
(WI.CPUTimelineView.prototype.get lowEnergyGraphBoundary):
(WI.CPUTimelineView.prototype.get mediumEnergyGraphBoundary):
(WI.CPUTimelineView.prototype.get highEnergyGraphBoundary):
(WI.CPUTimelineView.prototype.initialLayout):
(WI.CPUTimelineView.prototype.layout.bestThreadLayoutMax):
(WI.CPUTimelineView.prototype._layoutEnergyChart):

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@243704 268f45cc-cd09-0410-ab3c-d52691b4dbfc

Source/WebInspectorUI/ChangeLog
Source/WebInspectorUI/UserInterface/Views/CPUTimelineView.js

index 33ef980..29deaaf 100644 (file)
@@ -1,3 +1,35 @@
+2019-04-01  Joseph Pecoraro  <pecoraro@apple.com>
+
+        Web Inspector: CPU Usage Timeline - Adjust Energy Impact Threshholds
+        https://bugs.webkit.org/show_bug.cgi?id=196421
+        <rdar://problem/49125703>
+
+        Reviewed by Devin Rousso.
+
+        - Low - Keep Below 3% to continue to encourage idle pages stay below 3%
+          Might want to reduce to 2.5 or 2 after fixing bug 196419.
+
+        - High - Make Above 30% instead of 50% to encourage long running interactivity to stay below 30%
+          Depends on interaction, but sustained (1-2min) at 30%+ will certainly impact battery.
+
+        - Very High - Make above 100% instead of 150%
+          CPU Usage spikes around page load and is quite often still under 100% despite many threads.
+          Drop this a bit as we dropped High down.
+
+        Reduce the size of the Medium section, and increase the High section
+        Having 70% of the chart be "Medium" is just too much Medium, and
+        we've now made it more possible to be in the High range.
+
+        * UserInterface/Views/CPUTimelineView.js:
+        (WI.CPUTimelineView.prototype.get mediumEnergyThreshold):
+        (WI.CPUTimelineView.prototype.get highEnergyThreshold):
+        (WI.CPUTimelineView.prototype.get lowEnergyGraphBoundary):
+        (WI.CPUTimelineView.prototype.get mediumEnergyGraphBoundary):
+        (WI.CPUTimelineView.prototype.get highEnergyGraphBoundary):
+        (WI.CPUTimelineView.prototype.initialLayout):
+        (WI.CPUTimelineView.prototype.layout.bestThreadLayoutMax):
+        (WI.CPUTimelineView.prototype._layoutEnergyChart):
+
 2019-03-29  Myles C. Maxfield  <mmaxfield@apple.com>
 
         Delete WebMetal implementation in favor of WebGPU
index 97fc8d4..a0e3421 100644 (file)
@@ -71,8 +71,12 @@ WI.CPUTimelineView = class CPUTimelineView extends WI.TimelineView
     static get indicatorViewHeight() { return 15; }
 
     static get lowEnergyThreshold() { return 3; }
-    static get mediumEnergyThreshold() { return 50; }
-    static get highEnergyThreshold() { return 150; }
+    static get mediumEnergyThreshold() { return 30; }
+    static get highEnergyThreshold() { return 100; }
+
+    static get lowEnergyGraphBoundary() { return 10; }
+    static get mediumEnergyGraphBoundary() { return 70; }
+    static get highEnergyGraphBoundary() { return 100; }
 
     static get defaultSectionLimit() { return 5; }
 
@@ -261,9 +265,9 @@ WI.CPUTimelineView = class CPUTimelineView extends WI.TimelineView
             height: 110,
             strokeWidth: 20,
             segments: [
-                {className: "low", limit: 10},
-                {className: "medium", limit: 80},
-                {className: "high", limit: 100},
+                {className: "low", limit: CPUTimelineView.lowEnergyGraphBoundary},
+                {className: "medium", limit: CPUTimelineView.mediumEnergyGraphBoundary},
+                {className: "high", limit: CPUTimelineView.highEnergyGraphBoundary},
             ]
         });
         this.addSubview(this._energyChart);
@@ -591,7 +595,7 @@ WI.CPUTimelineView = class CPUTimelineView extends WI.TimelineView
 
         function bestThreadLayoutMax(value) {
             if (value > 100)
-                return Math.ceil(value);            
+                return Math.ceil(value);
             return (Math.floor(value / 25) + 1) * 25;
         }
 
@@ -1102,19 +1106,19 @@ WI.CPUTimelineView = class CPUTimelineView extends WI.TimelineView
             // Low. (<=3% CPU, mapped to 0-10)
             this._energyImpactLabelElement.textContent = WI.UIString("Low");
             this._energyImpactLabelElement.classList.add("low");
-            this._energyChart.value = mapWithBias(average, 0, CPUTimelineView.lowEnergyThreshold, 0, 10, 0.85);
+            this._energyChart.value = mapWithBias(average, 0, CPUTimelineView.lowEnergyThreshold, 0, CPUTimelineView.lowEnergyGraphBoundary, 0.85);
         } else if (average <= CPUTimelineView. mediumEnergyThreshold) {
-            // Medium (3%-90% CPU, mapped to 10-80)
+            // Medium (3%-30% CPU, mapped to 10-70)
             this._energyImpactLabelElement.textContent = WI.UIString("Medium");
             this._energyImpactLabelElement.classList.add("medium");
-            this._energyChart.value = mapWithBias(average, CPUTimelineView.lowEnergyThreshold, CPUTimelineView.mediumEnergyThreshold, 10, 80, 0.6);
+            this._energyChart.value = mapWithBias(average, CPUTimelineView.lowEnergyThreshold, CPUTimelineView.mediumEnergyThreshold, CPUTimelineView.lowEnergyGraphBoundary, CPUTimelineView.mediumEnergyGraphBoundary, 0.6);
         } else if (average < CPUTimelineView. highEnergyThreshold) {
-            // High. (50-150% CPU, mapped to 80-100)
+            // High. (30%-100% CPU, mapped to 70-100)
             this._energyImpactLabelElement.textContent = WI.UIString("High");
             this._energyImpactLabelElement.classList.add("high");
-            this._energyChart.value = mapWithBias(average, CPUTimelineView.mediumEnergyThreshold, CPUTimelineView.highEnergyThreshold, 80, 100, 0.9);
+            this._energyChart.value = mapWithBias(average, CPUTimelineView.mediumEnergyThreshold, CPUTimelineView.highEnergyThreshold, CPUTimelineView.mediumEnergyGraphBoundary, CPUTimelineView.highEnergyGraphBoundary, 0.9);
         } else {
-            // Very High. (>150% CPU, mapped to 100)
+            // Very High. (>100% CPU, mapped to 100)
             this._energyImpactLabelElement.textContent = WI.UIString("Very High");
             this._energyImpactLabelElement.classList.add("high");
             this._energyChart.value = 100;