Title: [195504] trunk/Source/WebInspectorUI
Revision
195504
Author
[email protected]
Date
2016-01-22 22:46:56 -0800 (Fri, 22 Jan 2016)

Log Message

Web Inspector: Reduce unnecessary forced layouts in TimelineRuler
https://bugs.webkit.org/show_bug.cgi?id=153390
<rdar://problem/24312241>

Patch by Joseph Pecoraro <[email protected]> on 2016-01-22
Reviewed by Timothy Hatcher.

TimelineRuler's width rarely changes. It should only need to calculate
its width when added to the DOM or if the content view containing it
has resized and the bounds of the ruler may have changed.

Switch everything in TimelineRuler to using a cached width, and add
an explicit method, resize, to update this width. This eliminated
frequent hangs I was seeing while recording timelines.

* UserInterface/Views/OverviewTimelineView.js:
(WebInspector.OverviewTimelineView.prototype.shown):
(WebInspector.OverviewTimelineView.prototype.updateLayoutForResize):
Resize the ruler when the view is shown or resized.

* UserInterface/Views/TimelineOverview.js:
(WebInspector.TimelineOverview.prototype.shown):
(WebInspector.TimelineOverview.prototype.updateLayoutForResize):
Resize the ruler when the view is shown or resized.

* UserInterface/Views/TimelineRecordingContentView.js:
(WebInspector.TimelineRecordingContentView.prototype.layout):
Inform the current content view of a resize if possible.

* UserInterface/Views/TimelineRuler.js:
(WebInspector.TimelineRuler.prototype.resize):
Update the width.

(WebInspector.TimelineRuler.prototype._recalculate):
(WebInspector.TimelineRuler.prototype._needsMarkerLayout):
(WebInspector.TimelineRuler.prototype._needsSelectionLayout):
(WebInspector.TimelineRuler.prototype._handleMouseMove):
(WebInspector.TimelineRuler.prototype._handleSelectionHandleMouseMove):
Use cached width.

* UserInterface/Views/TimelineRecordBar.js:
(WebInspector.TimelineRecordBar.createCombinedBars): Deleted.
Remove some stale code.

Modified Paths

Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (195503 => 195504)


--- trunk/Source/WebInspectorUI/ChangeLog	2016-01-23 03:24:42 UTC (rev 195503)
+++ trunk/Source/WebInspectorUI/ChangeLog	2016-01-23 06:46:56 UTC (rev 195504)
@@ -1,3 +1,48 @@
+2016-01-22  Joseph Pecoraro  <[email protected]>
+
+        Web Inspector: Reduce unnecessary forced layouts in TimelineRuler
+        https://bugs.webkit.org/show_bug.cgi?id=153390
+        <rdar://problem/24312241>
+
+        Reviewed by Timothy Hatcher.
+
+        TimelineRuler's width rarely changes. It should only need to calculate
+        its width when added to the DOM or if the content view containing it
+        has resized and the bounds of the ruler may have changed.
+
+        Switch everything in TimelineRuler to using a cached width, and add
+        an explicit method, resize, to update this width. This eliminated
+        frequent hangs I was seeing while recording timelines.
+
+        * UserInterface/Views/OverviewTimelineView.js:
+        (WebInspector.OverviewTimelineView.prototype.shown):
+        (WebInspector.OverviewTimelineView.prototype.updateLayoutForResize):
+        Resize the ruler when the view is shown or resized.
+
+        * UserInterface/Views/TimelineOverview.js:
+        (WebInspector.TimelineOverview.prototype.shown):
+        (WebInspector.TimelineOverview.prototype.updateLayoutForResize):
+        Resize the ruler when the view is shown or resized.
+
+        * UserInterface/Views/TimelineRecordingContentView.js:
+        (WebInspector.TimelineRecordingContentView.prototype.layout):
+        Inform the current content view of a resize if possible.
+
+        * UserInterface/Views/TimelineRuler.js:
+        (WebInspector.TimelineRuler.prototype.resize):
+        Update the width.
+
+        (WebInspector.TimelineRuler.prototype._recalculate):
+        (WebInspector.TimelineRuler.prototype._needsMarkerLayout):
+        (WebInspector.TimelineRuler.prototype._needsSelectionLayout):
+        (WebInspector.TimelineRuler.prototype._handleMouseMove):
+        (WebInspector.TimelineRuler.prototype._handleSelectionHandleMouseMove):
+        Use cached width.
+
+        * UserInterface/Views/TimelineRecordBar.js:
+        (WebInspector.TimelineRecordBar.createCombinedBars): Deleted.
+        Remove some stale code.
+
 2016-01-22  Devin Rousso  <[email protected]>
 
         Web Inspector: Sidebar's should remember their width's

Modified: trunk/Source/WebInspectorUI/UserInterface/Views/OverviewTimelineView.js (195503 => 195504)


--- trunk/Source/WebInspectorUI/UserInterface/Views/OverviewTimelineView.js	2016-01-23 03:24:42 UTC (rev 195503)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/OverviewTimelineView.js	2016-01-23 06:46:56 UTC (rev 195504)
@@ -81,6 +81,7 @@
         super.shown();
 
         this._treeOutlineDataGridSynchronizer.synchronize();
+        this._timelineRuler.resize();
     }
 
     closed()
@@ -159,6 +160,11 @@
         WebInspector.showOriginalOrFormattedSourceCodeLocation(treeElement.sourceCodeTimeline.sourceCodeLocation);
     }
 
+    updateLayoutForResize()
+    {
+        this._timelineRuler.resize();
+    }
+
     layout()
     {
         let oldZeroTime = this._timelineRuler.zeroTime;

Modified: trunk/Source/WebInspectorUI/UserInterface/Views/TimelineOverview.js (195503 => 195504)


--- trunk/Source/WebInspectorUI/UserInterface/Views/TimelineOverview.js	2016-01-23 03:24:42 UTC (rev 195503)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/TimelineOverview.js	2016-01-23 06:46:56 UTC (rev 195504)
@@ -257,6 +257,8 @@
     {
         this._visible = true;
 
+        this._timelineRuler.resize()
+
         for (var timelineOverviewGraph of this._timelineOverviewGraphsMap.values())
             timelineOverviewGraph.shown();
 
@@ -313,6 +315,7 @@
     updateLayoutForResize()
     {
         this._cachedScrollContainerWidth = NaN;
+        this._timelineRuler.resize()
         this.updateLayout();
     }
 

Modified: trunk/Source/WebInspectorUI/UserInterface/Views/TimelineRecordBar.js (195503 => 195504)


--- trunk/Source/WebInspectorUI/UserInterface/Views/TimelineRecordBar.js	2016-01-23 03:24:42 UTC (rev 195503)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/TimelineRecordBar.js	2016-01-23 06:46:56 UTC (rev 195504)
@@ -125,8 +125,6 @@
             visibleRecords.sort(compareByActiveStartTime);
         }
 
-        lastRecordType = null;
-
         var activeStartTime = NaN;
         var activeEndTime = NaN;
         var activeRecords = [];

Modified: trunk/Source/WebInspectorUI/UserInterface/Views/TimelineRecordingContentView.js (195503 => 195504)


--- trunk/Source/WebInspectorUI/UserInterface/Views/TimelineRecordingContentView.js	2016-01-23 03:24:42 UTC (rev 195503)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/TimelineRecordingContentView.js	2016-01-23 06:46:56 UTC (rev 195504)
@@ -324,6 +324,10 @@
     layout()
     {
         this._currentTimelineOverview.updateLayoutForResize();
+
+        let currentContentView = this._contentViewContainer.currentContentView;
+        if (currentContentView && currentContentView.updateLayoutForResize)
+            currentContentView.updateLayoutForResize();
     }
 
     // Private

Modified: trunk/Source/WebInspectorUI/UserInterface/Views/TimelineRuler.js (195503 => 195504)


--- trunk/Source/WebInspectorUI/UserInterface/Views/TimelineRuler.js	2016-01-23 03:24:42 UTC (rev 195503)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/TimelineRuler.js	2016-01-23 06:46:56 UTC (rev 195504)
@@ -506,7 +506,7 @@
         this._scheduledMarkerLayoutUpdateIdentifier = requestAnimationFrame(() => {
             this._scheduledMarkerLayoutUpdateIdentifier = undefined;
 
-            let visibleWidth = this.element.clientWidth;
+            let visibleWidth = this._cachedClientWidth;
             if (visibleWidth <= 0)
                 return;
 
@@ -529,7 +529,7 @@
         this._scheduledSelectionLayoutUpdateIdentifier = requestAnimationFrame(() => {
             this._scheduledSelectionLayoutUpdateIdentifier = undefined;
 
-            let visibleWidth = this.element.clientWidth;
+            let visibleWidth = this._cachedClientWidth;
             if (visibleWidth <= 0)
                 return;
 
@@ -537,9 +537,15 @@
         });
     }
 
+    resize()
+    {
+        this._cachedClientWidth = this.element.clientWidth;
+        this._recalculate();
+    }
+
     _recalculate()
     {
-        let visibleWidth = this.element.clientWidth;
+        let visibleWidth = this._cachedClientWidth;
         if (visibleWidth <= 0)
             return 0;
 
@@ -732,7 +738,7 @@
             this.element.classList.add(WebInspector.TimelineRuler.ResizingSelectionStyleClassName);
         }
 
-        this._updateSelection(this.element.clientWidth, this.duration);
+        this._updateSelection(this._cachedClientWidth, this.duration);
 
         event.preventDefault();
         event.stopPropagation();
@@ -826,7 +832,7 @@
                 this.selectionEndTime = Math.min(Math.max(this.selectionStartTime + this.minimumSelectionDuration, currentTime), this.endTime);
         }
 
-        this._updateSelection(this.element.clientWidth, this.duration);
+        this._updateSelection(this._cachedClientWidth, this.duration);
 
         event.preventDefault();
         event.stopPropagation();
_______________________________________________
webkit-changes mailing list
[email protected]
https://lists.webkit.org/mailman/listinfo/webkit-changes

Reply via email to