Modified: trunk/Source/WebInspectorUI/ChangeLog (214586 => 214587)
--- trunk/Source/WebInspectorUI/ChangeLog 2017-03-30 01:05:58 UTC (rev 214586)
+++ trunk/Source/WebInspectorUI/ChangeLog 2017-03-30 01:06:31 UTC (rev 214587)
@@ -1,3 +1,28 @@
+2017-03-29 Nikita Vasilyev <nvasil...@apple.com>
+
+ Web Inspector: WebSockets: Messages log should remain being scrolled to the bottom when a new message is added
+ https://bugs.webkit.org/show_bug.cgi?id=170090
+
+ Reviewed by Matt Baker.
+
+ Adding many Web Socket messages quickly can create a performance bottleneck. Batch addition of DataGrid nodes
+ using requestAnimationFrame, and scroll to the bottom of the DataGrid at most once per a batch update.
+
+ * UserInterface/Views/WebSocketContentView.js:
+ (WebInspector.WebSocketContentView):
+ (WebInspector.WebSocketContentView.prototype.shown):
+ (WebInspector.WebSocketContentView.prototype.hidden):
+ (WebInspector.WebSocketContentView.prototype._updateFramesSoon):
+ Batch WebSocketContentView DOM modifications using requestAnimationFrame.
+
+ (WebInspector.WebSocketContentView.prototype._updateFrames):
+ (WebInspector.WebSocketContentView.prototype._addFrame):
+ (WebInspector.WebSocketContentView.prototype.addFrame): Deleted.
+ Make addFrame method private since it isn't used anywhere outside of this class.
+
+ (WebInspector.WebSocketContentView.prototype._updateState): Deleted.
+ Make _updateState a part of _updateFramesSoon.
+
2017-03-29 Sam Brodkin <i...@apple.com>
Web Inspector: Network tab content view is blank after reload
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/WebSocketContentView.js (214586 => 214587)
--- trunk/Source/WebInspectorUI/UserInterface/Views/WebSocketContentView.js 2017-03-30 01:05:58 UTC (rev 214586)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/WebSocketContentView.js 2017-03-30 01:06:31 UTC (rev 214587)
@@ -82,56 +82,57 @@
shown()
{
this._updateFrames();
- this._updateState();
-
- this._resource.addEventListener(WebInspector.WebSocketResource.Event.FrameAdded, this._updateFrames, this);
- this._resource.addEventListener(WebInspector.WebSocketResource.Event.ReadyStateChanged, this._updateState, this);
+ this._resource.addEventListener(WebInspector.WebSocketResource.Event.FrameAdded, this._updateFramesSoon, this);
+ this._resource.addEventListener(WebInspector.WebSocketResource.Event.ReadyStateChanged, this._updateFramesSoon, this);
}
hidden()
{
- this._resource.removeEventListener(WebInspector.WebSocketResource.Event.FrameAdded, this._updateFrames, this);
- this._resource.removeEventListener(WebInspector.WebSocketResource.Event.ReadyStateChanged, this._updateState, this);
+ this._resource.removeEventListener(WebInspector.WebSocketResource.Event.FrameAdded, this._updateFramesSoon, this);
+ this._resource.removeEventListener(WebInspector.WebSocketResource.Event.ReadyStateChanged, this._updateFramesSoon, this);
}
- addFrame(data, isOutgoing, opcode, time)
+ // Private
+
+ _updateFramesSoon()
{
- let nodeText;
- if (opcode === WebInspector.WebSocketResource.OpCodes.TextFrame)
- nodeText = data;
- else
- nodeText = WebInspector.WebSocketContentView.textForOpcode(opcode);
-
- let attributes = {
- isOutgoing,
- isText: opcode === WebInspector.WebSocketResource.OpCodes.TextFrame,
- };
-
- this._addRow(nodeText, time, attributes);
+ this.onNextFrame._updateFrames();
}
- // Private
-
_updateFrames()
{
+ let shouldScrollToBottom = this._dataGrid.isScrolledToLastRow();
+
let framesLength = this._resource.frames.length;
for (let index = this._framesRendered; index < framesLength; index++) {
let frame = this._resource.frames[index];
let {data, isOutgoing, opcode, walltime} = frame;
- this.addFrame(data, isOutgoing, opcode, walltime);
+ this._addFrame(data, isOutgoing, opcode, walltime);
}
+
this._framesRendered = framesLength;
+
+ if (this._lastRenderedReadyState !== this._resource.readyState) {
+ if (this._resource.readyState === WebInspector.WebSocketResource.ReadyState.Closed)
+ this._dataGrid.appendChild(new WebInspector.SpanningDataGridNode(WebInspector.UIString("Connection Closed")));
+
+ this._lastRenderedReadyState = this._resource.readyState;
+ }
+
+ if (shouldScrollToBottom)
+ this._dataGrid.onNextFrame.scrollToLastRow();
}
- _updateState(event)
+ _addFrame(data, isOutgoing, opcode, time)
{
- if (this._lastRenderedReadyState === this._resource.readyState)
- return;
+ let nodeText;
+ let isText = opcode === WebInspector.WebSocketResource.OpCodes.TextFrame;
+ if (isText)
+ nodeText = data;
+ else
+ nodeText = WebInspector.WebSocketContentView.textForOpcode(opcode);
- if (this._resource.readyState === WebInspector.WebSocketResource.ReadyState.Closed)
- this._dataGrid.appendChild(new WebInspector.SpanningDataGridNode(WebInspector.UIString("Connection Closed")));
-
- this._lastRenderedReadyState = this._resource.readyState;
+ this._addRow(nodeText, time, {isOutgoing, isText});
}
_addRow(data, time, attributes = {})
