- Revision
- 120891
- Author
- [email protected]
- Date
- 2012-06-20 17:53:25 -0700 (Wed, 20 Jun 2012)
Log Message
Web Inspector: reduce timeline refresh rate
https://bugs.webkit.org/show_bug.cgi?id=89548
Reviewed by Pavel Feldman.
Minimize resource contention with the inspected page during refresh:
- reduce refresh for both overview and main panes to 300ms
- automatically limit window size to approximately one pageful of events in the lower pane
- do not refresh lower pane for events that are outside of the window
* inspector/front-end/TimelineOverviewPane.js:
(WebInspector.TimelineOverviewPane.prototype._update):
(WebInspector.TimelineOverviewPane.prototype._onWindowChanged):
(WebInspector.TimelineOverviewPane.prototype.setWindowTimes): Set overview window by times.
(WebInspector.TimelineOverviewPane.prototype._updateWindow):
(WebInspector.TimelineOverviewPane.prototype._scheduleRefresh): Refresh once in 300ms (insted of once in 100ms).
(WebInspector.TimelineOverviewWindow.prototype._setWindow):
* inspector/front-end/TimelinePanel.js:
(WebInspector.TimelinePanel.prototype._onTimelineEventRecorded): Do not refresh if the new record is outside of window.
(WebInspector.TimelinePanel.prototype._innerAddRecordToTimeline):
(WebInspector.TimelinePanel.prototype._resetPanel):
(WebInspector.TimelinePanel.prototype._scheduleRefresh): Refresh rate: 100ms -> 300ms.
(WebInspector.TimelinePanel.prototype._refreshRecords): Automatically set overview window.
* inspector/front-end/TimelinePresentationModel.js: Expose filterRecords
(WebInspector.TimelinePresentationModel.prototype.filteredRecords):
(WebInspector.TimelinePresentationModel.prototype.filterRecords):
(WebInspector.TimelinePresentationModel.prototype._innerFilterRecords):
Modified Paths
Diff
Modified: trunk/Source/WebCore/ChangeLog (120890 => 120891)
--- trunk/Source/WebCore/ChangeLog 2012-06-21 00:43:59 UTC (rev 120890)
+++ trunk/Source/WebCore/ChangeLog 2012-06-21 00:53:25 UTC (rev 120891)
@@ -1,3 +1,34 @@
+2012-06-19 Andrey Kosyakov <[email protected]>
+
+ Web Inspector: reduce timeline refresh rate
+ https://bugs.webkit.org/show_bug.cgi?id=89548
+
+ Reviewed by Pavel Feldman.
+
+ Minimize resource contention with the inspected page during refresh:
+
+ - reduce refresh for both overview and main panes to 300ms
+ - automatically limit window size to approximately one pageful of events in the lower pane
+ - do not refresh lower pane for events that are outside of the window
+
+ * inspector/front-end/TimelineOverviewPane.js:
+ (WebInspector.TimelineOverviewPane.prototype._update):
+ (WebInspector.TimelineOverviewPane.prototype._onWindowChanged):
+ (WebInspector.TimelineOverviewPane.prototype.setWindowTimes): Set overview window by times.
+ (WebInspector.TimelineOverviewPane.prototype._updateWindow):
+ (WebInspector.TimelineOverviewPane.prototype._scheduleRefresh): Refresh once in 300ms (insted of once in 100ms).
+ (WebInspector.TimelineOverviewWindow.prototype._setWindow):
+ * inspector/front-end/TimelinePanel.js:
+ (WebInspector.TimelinePanel.prototype._onTimelineEventRecorded): Do not refresh if the new record is outside of window.
+ (WebInspector.TimelinePanel.prototype._innerAddRecordToTimeline):
+ (WebInspector.TimelinePanel.prototype._resetPanel):
+ (WebInspector.TimelinePanel.prototype._scheduleRefresh): Refresh rate: 100ms -> 300ms.
+ (WebInspector.TimelinePanel.prototype._refreshRecords): Automatically set overview window.
+ * inspector/front-end/TimelinePresentationModel.js: Expose filterRecords
+ (WebInspector.TimelinePresentationModel.prototype.filteredRecords):
+ (WebInspector.TimelinePresentationModel.prototype.filterRecords):
+ (WebInspector.TimelinePresentationModel.prototype._innerFilterRecords):
+
2012-06-20 Zeev Lieber <[email protected]>
[Chromium] Damage tracker is not used without partial swap, causing valid render passes to be removed
Modified: trunk/Source/WebCore/inspector/front-end/TimelineOverviewPane.js (120890 => 120891)
--- trunk/Source/WebCore/inspector/front-end/TimelineOverviewPane.js 2012-06-21 00:43:59 UTC (rev 120890)
+++ trunk/Source/WebCore/inspector/front-end/TimelineOverviewPane.js 2012-06-21 00:53:25 UTC (rev 120891)
@@ -184,6 +184,7 @@
{
delete this._refreshTimeout;
+ this._updateWindow();
this._overviewCalculator.setWindow(this._model.minimumRecordTime(), this._model.maximumRecordTime());
this._overviewCalculator.setDisplayWindow(0, this._overviewContainer.clientWidth);
@@ -300,6 +301,8 @@
_onWindowChanged: function()
{
+ if (this._ignoreWindowChangedEvent)
+ return;
if (this._frameOverview) {
var times = this._frameOverview.getWindowTimes(this.windowLeft(), this.windowRight());
this._windowStartTime = times.startTime;
@@ -314,6 +317,28 @@
},
/**
+ * @param {Number} left
+ * @param {Number} right
+ */
+ setWindowTimes: function(left, right)
+ {
+ this._windowStartTime = left;
+ this._windowEndTime = right;
+ this._updateWindow();
+ },
+
+ _updateWindow: function()
+ {
+ var offset = this._model.minimumRecordTime();
+ var timeSpan = this._model.maximumRecordTime() - offset;
+ var left = this._windowStartTime ? (this._windowStartTime - offset) / timeSpan : 0;
+ var right = this._windowEndTime < Infinity ? (this._windowEndTime - offset) / timeSpan : 1;
+ this._ignoreWindowChangedEvent = true;
+ this._overviewWindow._setWindow(left, right);
+ this._ignoreWindowChangedEvent = false;
+ },
+
+ /**
* @param {boolean} value
*/
setShowShortEvents: function(value)
@@ -327,7 +352,7 @@
return;
if (!this.isShowing())
return;
- this._refreshTimeout = setTimeout(this._update.bind(this), 100);
+ this._refreshTimeout = setTimeout(this._update.bind(this), 300);
}
}
@@ -498,6 +523,16 @@
this._setWindowPosition(0, this._parentElement.clientWidth);
},
+ /**
+ * @param {number} left
+ * @param {number} right
+ */
+ _setWindow: function(left, right)
+ {
+ var clientWidth = this._parentElement.clientWidth;
+ this._setWindowPosition(left * clientWidth, right * clientWidth);
+ },
+
_setWindowPosition: function(start, end)
{
var clientWidth = this._parentElement.clientWidth;
Modified: trunk/Source/WebCore/inspector/front-end/TimelinePanel.js (120890 => 120891)
--- trunk/Source/WebCore/inspector/front-end/TimelinePanel.js 2012-06-21 00:43:59 UTC (rev 120890)
+++ trunk/Source/WebCore/inspector/front-end/TimelinePanel.js 2012-06-21 00:53:25 UTC (rev 120891)
@@ -486,8 +486,8 @@
_onTimelineEventRecorded: function(event)
{
- this._innerAddRecordToTimeline(event.data, this._rootRecord());
- this._scheduleRefresh(false);
+ if (this._innerAddRecordToTimeline(event.data, this._rootRecord()))
+ this._scheduleRefresh(false);
},
_innerAddRecordToTimeline: function(record, parentRecord)
@@ -501,7 +501,9 @@
if (WebInspector.TimelinePresentationModel.isEventDivider(record))
timeStampRecords.push(record);
}
- WebInspector.TimelinePresentationModel.forAllRecords([ formattedRecord ], addTimestampRecords);
+ var records = [ formattedRecord ];
+ WebInspector.TimelinePresentationModel.forAllRecords(records, addTimestampRecords);
+ return !!this._presentationModel.filterRecords(records).length || formattedRecord.parent !== this._presentationModel.rootRecord;
},
sidebarResized: function(event)
@@ -543,6 +545,7 @@
this._adjustScrollPosition(0);
this._closeRecordDetails();
this._allRecordsCount = 0;
+ this._automaticallySizeWindow = true;
},
elementsToRestoreScrollPositionsFor: function()
@@ -590,7 +593,7 @@
this._refresh();
else {
if (!this._refreshTimeout)
- this._refreshTimeout = setTimeout(this._refresh.bind(this), 100);
+ this._refreshTimeout = setTimeout(this._refresh.bind(this), 300);
}
},
@@ -662,6 +665,15 @@
// Convert visible area to visible indexes. Always include top-level record for a visible nested record.
var startIndex = Math.max(0, Math.min(Math.floor(visibleTop / rowHeight) - 1, recordsInWindow.length - 1));
var endIndex = Math.min(recordsInWindow.length, Math.ceil(visibleBottom / rowHeight));
+ var lastVisibleLine = Math.max(0, Math.floor(visibleBottom / rowHeight) - 1);
+ if (this._automaticallySizeWindow && recordsInWindow.length > lastVisibleLine) {
+ this._automaticallySizeWindow = false;
+ // If we're at the top, always use real timeline start as a left window bound so that expansion arrow padding logic works.
+ var windowStartTime = startIndex ? recordsInWindow[startIndex].startTime : this._model.minimumRecordTime();
+ this._overviewPane.setWindowTimes(windowStartTime, recordsInWindow[Math.max(0, lastVisibleLine - 1)].endTime);
+ recordsInWindow = this._presentationModel.filteredRecords();
+ endIndex = Math.min(recordsInWindow.length, lastVisibleLine);
+ }
// Resize gaps first.
const top = (startIndex * rowHeight) + "px";
Modified: trunk/Source/WebCore/inspector/front-end/TimelinePresentationModel.js (120890 => 120891)
--- trunk/Source/WebCore/inspector/front-end/TimelinePresentationModel.js 2012-06-21 00:43:59 UTC (rev 120890)
+++ trunk/Source/WebCore/inspector/front-end/TimelinePresentationModel.js 2012-06-21 00:53:25 UTC (rev 120891)
@@ -295,6 +295,11 @@
filteredRecords: function()
{
+ return this.filterRecords(this._rootRecord.children);
+ },
+
+ filterRecords: function(records)
+ {
function filter(record)
{
for (var i = 0; i < this._filters.length; ++i) {
@@ -303,14 +308,18 @@
}
return true;
}
- return this._filterRecords(filter.bind(this));
+ return this._innerFilterRecords(filter.bind(this), records);
},
- _filterRecords: function(filter)
+ /**
+ * @param {function(WebInspector.TimelinePresentationModel.Record):boolean} filter
+ * @param {Array.<WebInspector.TimelinePresentationModel.Record>} inputRecords
+ */
+ _innerFilterRecords: function(filter, inputRecords)
{
var recordsInWindow = [];
- var stack = [{children: this._rootRecord.children, index: 0, parentIsCollapsed: false}];
+ var stack = [{children: inputRecords, index: 0, parentIsCollapsed: false}];
while (stack.length) {
var entry = stack[stack.length - 1];
var records = entry.children;
