Timeline: split frame model into trace-specific and record-specific parts

Source/devtools/front_end/timeline/TimelineFrameModel.js

Index: Source/devtools/front_end/timeline/TimelineFrameModel.js
diff --git a/Source/devtools/front_end/timeline/TimelineFrameModel.js b/Source/devtools/front_end/timeline/TimelineFrameModel.js
index 933ec9911281c0b3fb1fa3289e048d7b0c61402b..3bc276138902123e909de7f80c45508b71c8f9a6 100644
--- a/Source/devtools/front_end/timeline/TimelineFrameModel.js
+++ b/Source/devtools/front_end/timeline/TimelineFrameModel.js
@@ -33,32 +33,14 @@
  * @extends {WebInspector.TargetAwareObject}
  * @param {!WebInspector.Target} target
  */
-WebInspector.TimelineFrameModel = function(target)
+WebInspector.TimelineFrameModelBase = function(target)
 {
     WebInspector.TargetAwareObject.call(this, target);
 
     this.reset();
 }
 
-WebInspector.TimelineFrameModel.Events = {
-    FrameAdded: "FrameAdded"
-}
-
-WebInspector.TimelineFrameModel._mainFrameMarkers = [
-    WebInspector.TimelineModel.RecordType.ScheduleStyleRecalculation,
-    WebInspector.TimelineModel.RecordType.InvalidateLayout,
-    WebInspector.TimelineModel.RecordType.BeginFrame,
-    WebInspector.TimelineModel.RecordType.ScrollLayer
-];
-
-WebInspector.TimelineFrameModel._tracingMainFrameMarkers = [
-    WebInspector.TracingTimelineModel.RecordType.ScheduleStyleRecalculation,
-    WebInspector.TracingTimelineModel.RecordType.InvalidateLayout,
-    WebInspector.TracingTimelineModel.RecordType.BeginMainThreadFrame,
-    WebInspector.TracingTimelineModel.RecordType.ScrollLayer
-];
-
-WebInspector.TimelineFrameModel.prototype = {
+WebInspector.TimelineFrameModelBase.prototype = {
     /**
      * @return {!Array.<!WebInspector.TimelineFrame>}
      */
@@ -98,17 +80,8 @@ WebInspector.TimelineFrameModel.prototype = {
         return frames.slice(firstFrame, lastFrame);
     },
 
-    /**
-     * @param {boolean} value
-     */
-    setMergeRecords: function(value)
-    {
-        this._mergeRecords = value;
-    },
-
     reset: function()
     {
-        this._mergeRecords = true;
         this._minimumRecordTime = Infinity;
         this._frames = [];
         this._lastFrame = null;
@@ -117,143 +90,6 @@ WebInspector.TimelineFrameModel.prototype = {
         this._mainFrameCommitted = false;
         this._mainFrameRequested = false;
         this._aggregatedMainThreadWork = null;
-        this._mergingBuffer = new WebInspector.TimelineMergingRecordBuffer();
-    },
-
-    /**
-     * @param {!Array.<!WebInspector.TimelineModel.Record>} records
-     */
-    addRecords: function(records)
-    {
-        if (!records.length)
-            return;
-        if (records[0].startTime() < this._minimumRecordTime)
-            this._minimumRecordTime = records[0].startTime();
-        for (var i = 0; i < records.length; ++i)
-            this.addRecord(records[i]);
-    },
-
-    /**
-     * @param {!WebInspector.TimelineModel.Record} record
-     */
-    addRecord: function(record)
-    {
-        var recordTypes = WebInspector.TimelineModel.RecordType;
-        var programRecord = record.type() === recordTypes.Program ? record : null;
-
-        // Start collecting main frame
-        if (programRecord) {
-            if (!this._aggregatedMainThreadWork && this._findRecordRecursively(WebInspector.TimelineFrameModel._mainFrameMarkers, programRecord))
-                this._aggregatedMainThreadWork = {};
-        }
-        /** type {Array.<!WebInspector.TimelineModel.Record>} */
-        var records = [];
-        if (!this._mergeRecords)
-            records = [record];
-        else
-            records = this._mergingBuffer.process(record.thread(), /** type {Array.<!WebInspector.TimelineModel.Record>} */(programRecord ? record.children() || [] : [record]));
-        for (var i = 0; i < records.length; ++i) {
-            if (records[i].thread())
-                this._addBackgroundRecord(records[i]);
-            else
-                this._addMainThreadRecord(programRecord, records[i]);
-        }
-    },
-
-    /**
-     * @param {!Array.<!WebInspector.TracingModel.Event>} events
-     * @param {string} sessionId
-     */
-    addTraceEvents: function(events, sessionId)
-    {
-        this._sessionId = sessionId;
-        for (var i = 0; i < events.length; ++i)
-            this._addTraceEvent(events[i]);
-    },
-
-    /**
-     * @param {!WebInspector.TracingModel.Event} event
-     */
-    _addTraceEvent: function(event)
-    {
-        var eventNames = WebInspector.TracingTimelineModel.RecordType;
-
-        if (event.name === eventNames.SetLayerTreeId) {
-            if (this._sessionId === event.args["sessionId"])
-                this._layerTreeId = event.args["layerTreeId"];
-            return;
-        }
-        if (event.name === eventNames.TracingStartedInPage) {
-            this._mainThread = event.thread;
-            return;
-        }
-        if (event.thread === this._mainThread)
-            this._addMainThreadTraceEvent(event);
-        else
-            this._addBackgroundTraceEvent(event);
-    },
-
-    /**
-     * @param {!WebInspector.TracingModel.Event} event
-     */
-    _addBackgroundTraceEvent: function(event)
-    {
-        var eventNames = WebInspector.TracingTimelineModel.RecordType;
-
-        if (event.phase === WebInspector.TracingModel.Phase.SnapshotObject && event.name === eventNames.LayerTreeHostImplSnapshot && parseInt(event.id, 0) === this._layerTreeId) {
-            this.handleLayerTreeSnapshot(new WebInspector.DeferredTracingLayerTree(this.target(), event.args["snapshot"]["active_tree"]["root_layer"]));
-            return;
-        }
-        if (this._lastFrame && event.selfTime)
-            this._lastFrame._addTimeForCategory(WebInspector.TracingTimelineUIUtils.eventStyle(event).category.name, event.selfTime);
-
-        if (event.args["layerTreeId"] !== this._layerTreeId)
-            return;
-
-        var timestamp = event.startTime;
-        if (event.name === eventNames.BeginFrame)
-            this.handleBeginFrame(timestamp);
-        else if (event.name === eventNames.DrawFrame)
-            this.handleDrawFrame(timestamp);
-        else if (event.name === eventNames.ActivateLayerTree)
-            this.handleActivateLayerTree();
-        else if (event.name === eventNames.RequestMainThreadFrame)
-            this.handleRequestMainThreadFrame();
-    },
-
-    /**
-     * @param {!WebInspector.TracingModel.Event} event
-     */
-    _addMainThreadTraceEvent: function(event)
-    {
-        var eventNames = WebInspector.TracingTimelineModel.RecordType;
-        var timestamp = event.startTime;
-        var selfTime = event.selfTime || 0;
-
-        if (!this._hasThreadedCompositing) {
-            if (event.name === eventNames.BeginMainThreadFrame)
-                this._startMainThreadFrame(timestamp);
-            if (!this._lastFrame)
-                return;
-            if (!selfTime)
-                return;
-
-            var categoryName = WebInspector.TracingTimelineUIUtils.eventStyle(event).category.name;
-            this._lastFrame._addTimeForCategory(categoryName, selfTime);
-            return;
-        }
-
-        if (!this._aggregatedMainThreadWork && WebInspector.TimelineFrameModel._tracingMainFrameMarkers.indexOf(event.name) >= 0)
-            this._aggregatedMainThreadWork = {};
-        if (!this._aggregatedMainThreadWork)
-            return;
-
-        if (selfTime) {
-            var categoryName = WebInspector.TracingTimelineUIUtils.eventStyle(event).category.name;
-            this._aggregatedMainThreadWork[categoryName] = (this._aggregatedMainThreadWork[categoryName] || 0) + selfTime;
-        }
-        if (event.name === eventNames.CompositeLayers && event.args["layerTreeId"] === this._layerTreeId)
-            this.handleCompositeLayers();
     },
 
     /**
@@ -316,6 +152,137 @@ WebInspector.TimelineFrameModel.prototype = {
     },
 
     /**
+     * @param {number} startTime
+     */
+    _startBackgroundFrame: function(startTime)
+    {
+        if (!this._hasThreadedCompositing) {
+            this._lastFrame = null;
+            this._hasThreadedCompositing = true;
+        }
+        if (this._lastFrame)
+            this._flushFrame(this._lastFrame, startTime);
+
+        this._lastFrame = new WebInspector.TimelineFrame(startTime, startTime - this._minimumRecordTime);
+    },
+
+    /**
+     * @param {number} startTime
+     */
+    _startMainThreadFrame: function(startTime)
+    {
+        if (this._lastFrame)
+            this._flushFrame(this._lastFrame, startTime);
+        this._lastFrame = new WebInspector.TimelineFrame(startTime, startTime - this._minimumRecordTime);
+    },
+
+    /**
+     * @param {!WebInspector.TimelineFrame} frame
+     * @param {number} endTime
+     */
+    _flushFrame: function(frame, endTime)
+    {
+        frame._setLayerTree(this._lastLayerTree);
+        frame._setEndTime(endTime);
+        this._frames.push(frame);
+    },
+
+    /**
+     * @param {!Array.<string>} types
+     * @param {!WebInspector.TimelineModel.Record} record
+     * @return {?WebInspector.TimelineModel.Record} record
+     */
+    _findRecordRecursively: function(types, record)
+    {
+        if (types.indexOf(record.type()) >= 0)
+            return record;
+        if (!record.children())
+            return null;
+        for (var i = 0; i < record.children().length; ++i) {
+            var result = this._findRecordRecursively(types, record.children()[i]);
+            if (result)
+                return result;
+        }
+        return null;
+    },
+
+    __proto__: WebInspector.TargetAwareObject.prototype
+}
+
+/**
+ * @constructor
+ * @param {!WebInspector.Target} target
+ * @extends {WebInspector.TimelineFrameModelBase}
+ */
+WebInspector.TimelineFrameModel = function(target)
+{
+    WebInspector.TimelineFrameModelBase.call(this, target);
+}
+
+WebInspector.TimelineFrameModel._mainFrameMarkers = [
+    WebInspector.TimelineModel.RecordType.ScheduleStyleRecalculation,
+    WebInspector.TimelineModel.RecordType.InvalidateLayout,
+    WebInspector.TimelineModel.RecordType.BeginFrame,
+    WebInspector.TimelineModel.RecordType.ScrollLayer
+];
+
+WebInspector.TimelineFrameModel.prototype = {
+    reset: function()
+    {
+        this._mergeRecords = true;
+        this._mergingBuffer = new WebInspector.TimelineMergingRecordBuffer();
+        WebInspector.TimelineFrameModelBase.prototype.reset.call(this);
+    },
+
+    /**
+     * @param {boolean} value
+     */
+    setMergeRecords: function(value)
+    {
+        this._mergeRecords = value;
+    },
+
+    /**
+     * @param {!Array.<!WebInspector.TimelineModel.Record>} records
+     */
+    addRecords: function(records)
+    {
+        if (!records.length)
+            return;
+        if (records[0].startTime() < this._minimumRecordTime)
+            this._minimumRecordTime = records[0].startTime();
+        for (var i = 0; i < records.length; ++i)
+            this.addRecord(records[i]);
+    },
+
+    /**
+     * @param {!WebInspector.TimelineModel.Record} record
+     */
+    addRecord: function(record)
+    {
+        var recordTypes = WebInspector.TimelineModel.RecordType;
+        var programRecord = record.type() === recordTypes.Program ? record : null;
+
+        // Start collecting main frame
+        if (programRecord) {
+            if (!this._aggregatedMainThreadWork && this._findRecordRecursively(WebInspector.TimelineFrameModel._mainFrameMarkers, programRecord))
+                this._aggregatedMainThreadWork = {};
+        }
+        /** type {Array.<!WebInspector.TimelineModel.Record>} */
+        var records = [];
+        if (!this._mergeRecords)
+            records = [record];
+        else
+            records = this._mergingBuffer.process(record.thread(), /** type {Array.<!WebInspector.TimelineModel.Record>} */(programRecord ? record.children() || [] : [record]));
+        for (var i = 0; i < records.length; ++i) {
+            if (records[i].thread())
+                this._addBackgroundRecord(records[i]);
+            else
+                this._addMainThreadRecord(programRecord, records[i]);
+        }
+    },
+
+    /**
      * @param {!WebInspector.TimelineModel.Record} record
      */
     _addBackgroundRecord: function(record)
@@ -381,63 +348,124 @@ WebInspector.TimelineFrameModel.prototype = {
         return programRecord.endTime() - programRecord.startTime() - accounted;
     },
 
+    __proto__: WebInspector.TimelineFrameModelBase.prototype,
+};
+
+/**
+ * @constructor
+ * @param {!WebInspector.Target} target
+ * @extends {WebInspector.TimelineFrameModelBase}
+ */
+WebInspector.TracingTimelineFrameModel = function(target)
+{
+    WebInspector.TimelineFrameModelBase.call(this, target);
+}
+
+WebInspector.TracingTimelineFrameModel._mainFrameMarkers = [
+    WebInspector.TracingTimelineModel.RecordType.ScheduleStyleRecalculation,
+    WebInspector.TracingTimelineModel.RecordType.InvalidateLayout,
+    WebInspector.TracingTimelineModel.RecordType.BeginMainThreadFrame,
+    WebInspector.TracingTimelineModel.RecordType.ScrollLayer
+];
+
+WebInspector.TracingTimelineFrameModel.prototype = {
     /**
-     * @param {number} startTime
+     * @param {!Array.<!WebInspector.TracingModel.Event>} events
+     * @param {string} sessionId
      */
-    _startBackgroundFrame: function(startTime)
+    addTraceEvents: function(events, sessionId)
     {
-        if (!this._hasThreadedCompositing) {
-            this._lastFrame = null;
-            this._hasThreadedCompositing = true;
-        }
-        if (this._lastFrame)
-            this._flushFrame(this._lastFrame, startTime);
-
-        this._lastFrame = new WebInspector.TimelineFrame(startTime, startTime - this._minimumRecordTime);
+        this._sessionId = sessionId;
+        for (var i = 0; i < events.length; ++i)
+            this._addTraceEvent(events[i]);
     },
 
     /**
-     * @param {number} startTime
+     * @param {!WebInspector.TracingModel.Event} event
      */
-    _startMainThreadFrame: function(startTime)
+    _addTraceEvent: function(event)
     {
-        if (this._lastFrame)
-            this._flushFrame(this._lastFrame, startTime);
-        this._lastFrame = new WebInspector.TimelineFrame(startTime, startTime - this._minimumRecordTime);
+        var eventNames = WebInspector.TracingTimelineModel.RecordType;
+
+        if (event.name === eventNames.SetLayerTreeId) {
+            if (this._sessionId === event.args["sessionId"])
+                this._layerTreeId = event.args["layerTreeId"];
+            return;
+        }
+        if (event.name === eventNames.TracingStartedInPage) {
+            this._mainThread = event.thread;
+            return;
+        }
+        if (event.thread === this._mainThread)
+            this._addMainThreadTraceEvent(event);
+        else
+            this._addBackgroundTraceEvent(event);
     },
 
     /**
-     * @param {!WebInspector.TimelineFrame} frame
-     * @param {number} endTime
+     * @param {!WebInspector.TracingModel.Event} event
      */
-    _flushFrame: function(frame, endTime)
+    _addBackgroundTraceEvent: function(event)
     {
-        frame._setLayerTree(this._lastLayerTree);
-        frame._setEndTime(endTime);
-        this._frames.push(frame);
-        this.dispatchEventToListeners(WebInspector.TimelineFrameModel.Events.FrameAdded, frame);
+        var eventNames = WebInspector.TracingTimelineModel.RecordType;
+
+        if (event.phase === WebInspector.TracingModel.Phase.SnapshotObject && event.name === eventNames.LayerTreeHostImplSnapshot && parseInt(event.id, 0) === this._layerTreeId) {
+            this.handleLayerTreeSnapshot(new WebInspector.DeferredTracingLayerTree(this.target(), event.args["snapshot"]["active_tree"]["root_layer"]));
+            return;
+        }
+        if (this._lastFrame && event.selfTime)
+            this._lastFrame._addTimeForCategory(WebInspector.TracingTimelineUIUtils.eventStyle(event).category.name, event.selfTime);
+
+        if (event.args["layerTreeId"] !== this._layerTreeId)
+            return;
+
+        var timestamp = event.startTime;
+        if (event.name === eventNames.BeginFrame)
+            this.handleBeginFrame(timestamp);
+        else if (event.name === eventNames.DrawFrame)
+            this.handleDrawFrame(timestamp);
+        else if (event.name === eventNames.ActivateLayerTree)
+            this.handleActivateLayerTree();
+        else if (event.name === eventNames.RequestMainThreadFrame)
+            this.handleRequestMainThreadFrame();
     },
 
     /**
-     * @param {!Array.<string>} types
-     * @param {!WebInspector.TimelineModel.Record} record
-     * @return {?WebInspector.TimelineModel.Record} record
+     * @param {!WebInspector.TracingModel.Event} event
      */
-    _findRecordRecursively: function(types, record)
+    _addMainThreadTraceEvent: function(event)
     {
-        if (types.indexOf(record.type()) >= 0)
-            return record;
-        if (!record.children())
-            return null;
-        for (var i = 0; i < record.children().length; ++i) {
-            var result = this._findRecordRecursively(types, record.children()[i]);
-            if (result)
-                return result;
+        var eventNames = WebInspector.TracingTimelineModel.RecordType;
+        var timestamp = event.startTime;
+        var selfTime = event.selfTime || 0;
+
+        if (!this._hasThreadedCompositing) {
+            if (event.name === eventNames.BeginMainThreadFrame)
+                this._startMainThreadFrame(timestamp);
+            if (!this._lastFrame)
+                return;
+            if (!selfTime)
+                return;
+
+            var categoryName = WebInspector.TracingTimelineUIUtils.eventStyle(event).category.name;
+            this._lastFrame._addTimeForCategory(categoryName, selfTime);
+            return;
         }
-        return null;
+
+        if (!this._aggregatedMainThreadWork && WebInspector.TracingTimelineFrameModel._mainFrameMarkers.indexOf(event.name) >= 0)
+            this._aggregatedMainThreadWork = {};
+        if (!this._aggregatedMainThreadWork)
+            return;
+
+        if (selfTime) {
+            var categoryName = WebInspector.TracingTimelineUIUtils.eventStyle(event).category.name;
+            this._aggregatedMainThreadWork[categoryName] = (this._aggregatedMainThreadWork[categoryName] || 0) + selfTime;
+        }
+        if (event.name === eventNames.CompositeLayers && event.args["layerTreeId"] === this._layerTreeId)
+            this.handleCompositeLayers();
     },
 
-    __proto__: WebInspector.TargetAwareObject.prototype
+    __proto__: WebInspector.TimelineFrameModelBase.prototype
 }
 
 /**