[ Do not submit ] Prototype for invalidation analysis

Source/devtools/front_end/timeline/TracingTimelineModel.js

 // Copyright 2014 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 /**
  * @constructor
  * @param {!WebInspector.TracingModel} tracingModel
  * @param {!WebInspector.TimelineModel.Filter} recordFilter
  * @extends {WebInspector.TimelineModel}
  */
@@ skipping 14 matching lines @@
 
     GPUTask: "GPUTask",
 
     RequestMainThreadFrame: "RequestMainThreadFrame",
     BeginFrame: "BeginFrame",
     BeginMainThreadFrame: "BeginMainThreadFrame",
     ActivateLayerTree: "ActivateLayerTree",
     DrawFrame: "DrawFrame",
     ScheduleStyleRecalculation: "ScheduleStyleRecalculation",
     RecalculateStyles: "RecalculateStyles",
+    StyleInvalidationTracking: "StyleInvalidationTracking",
+    LayoutInvalidationTracking: "LayoutInvalidationTracking",
+    PaintInvalidationTracking: "PaintInvalidationTracking",
     InvalidateLayout: "InvalidateLayout",
     Layout: "Layout",
     UpdateLayer: "UpdateLayer",
     UpdateLayerTree: "UpdateLayerTree",
     PaintSetup: "PaintSetup",
     Paint: "Paint",
     PaintImage: "PaintImage",
     Rasterize: "Rasterize",
     RasterTask: "RasterTask",
     ScrollLayer: "ScrollLayer",
@@ skipping 63 matching lines @@
     this.name = name;
     /** @type {!Array.<!WebInspector.TracingModel.Event>} */
     this.events = [];
 }
 
 WebInspector.TracingTimelineModel.prototype = {
     /**
      * @param {boolean} captureStacks
      * @param {boolean} captureMemory
      * @param {boolean} capturePictures
+     * @param {boolean} captureInvalidationTracking
      */
-    startRecording: function(captureStacks, captureMemory, capturePictures)
+    startRecording: function(captureStacks, captureMemory, capturePictures, captureInvalidationTracking)
     {
         function disabledByDefault(category)
         {
             return "disabled-by-default-" + category;
         }
         var categoriesArray = [
             "-*",
             disabledByDefault("devtools.timeline"),
             disabledByDefault("devtools.timeline.frame"),
             WebInspector.TracingModel.ConsoleEventCategory
         ];
         if (captureStacks) {
             categoriesArray.push(disabledByDefault("devtools.timeline.stack"));
             if (WebInspector.experimentsSettings.timelineJSCPUProfile.isEnabled()) {
                 this._jsProfilerStarted = true;
                 this._currentTarget = WebInspector.context.flavor(WebInspector.Target);
                 this._configureCpuProfilerSamplingInterval();
                 this._currentTarget.profilerAgent().start();
             }
         }
         if (capturePictures) {
             categoriesArray = categoriesArray.concat([
                 disabledByDefault("devtools.timeline.layers"),
                 disabledByDefault("devtools.timeline.picture"),
                 disabledByDefault("blink.graphics_context_annotations")]);
         }
+        if (captureInvalidationTracking) {
+            categoriesArray = categoriesArray.concat([
+                disabledByDefault("devtools.timeline.styleInvalidationTracking"),
+                disabledByDefault("devtools.timeline.layoutInvalidationTracking"),
+                disabledByDefault("devtools.timeline.paintInvalidationTracking")
+            ]);
+        }
         var categories = categoriesArray.join(",");
         this._startRecordingWithCategories(categories);
     },
 
     stopRecording: function()
     {
         this._stopCallbackBarrier = new CallbackBarrier();
         if (this._jsProfilerStarted) {
             this._currentTarget.profilerAgent().stop(this._stopCallbackBarrier.createCallback(this._didStopRecordingJSSamples.bind(this)));
             this._jsProfilerStarted = false;
@@ skipping 215 matching lines @@
         if (record.type() === WebInspector.TracingTimelineModel.RecordType.GPUTask)
             this._gpuThreadTasks.push(record);
         this.dispatchEventToListeners(WebInspector.TimelineModel.Events.RecordAdded, record);
     },
 
     _resetProcessingState: function()
     {
         this._sendRequestEvents = {};
         this._timerEvents = {};
         this._requestAnimationFrameEvents = {};
+        this._invalidationTracker = new WebInspector.InvalidationTracker();
         this._layoutInvalidate = {};
         this._lastScheduleStyleRecalculation = {};
         this._webSocketCreateEvents = {};
         this._paintImageEventByPixelRefId = {};
         this._lastPaintForLayer = {};
         this._lastRecalculateStylesEvent = null;
         this._currentScriptEvent = null;
         this._eventStack = [];
     },
 
@@ skipping 90 matching lines @@
 
         case recordTypes.ScheduleStyleRecalculation:
             this._lastScheduleStyleRecalculation[event.args["frame"]] = event;
             break;
 
         case recordTypes.RecalculateStyles:
             event.initiator = this._lastScheduleStyleRecalculation[event.args["frame"]];
             this._lastRecalculateStylesEvent = event;
             break;
 
+        case recordTypes.StyleInvalidationTracking:
+            this._invalidationTracker.addStyleInvalidation({
+                frameId: event.args.data.frame,
+                nodeId: event.args.data.nodeId,
+                nodeName: event.args.data.nodeName,
+                callstack: event.args.data.callstack
+            });
+            break;
+
+        case recordTypes.LayoutInvalidationTracking:
+            this._invalidationTracker.addLayoutInvalidation({
+                frameId: event.args.data.frame,
+                nodeId: event.args.data.nodeId,
+                callstack: event.args.data.callstack
+            });
+            break;
+
+        case recordTypes.PaintInvalidationTracking:
+            this._invalidationTracker.addPaintInvalidation({
+                frameId: event.args.data.frame,
+                nodeId: event.args.data.nodeId
+            });
+            break;
+
         case recordTypes.InvalidateLayout:
             // Consider style recalculation as a reason for layout invalidation,
             // but only if we had no earlier layout invalidation records.
             var layoutInitator = event;
             var frameId = event.args["frame"];
             if (!this._layoutInvalidate[frameId] && this._lastRecalculateStylesEvent && this._lastRecalculateStylesEvent.endTime >  event.startTime)
                 layoutInitator = this._lastRecalculateStylesEvent.initiator;
             this._layoutInvalidate[frameId] = layoutInitator;
             break;
 
@@ skipping 21 matching lines @@
         case recordTypes.FunctionCall:
             if (!this._currentScriptEvent)
                 this._currentScriptEvent = event;
             break;
 
         case recordTypes.SetLayerTreeId:
             this._inspectedTargetLayerTreeId = event.args["layerTreeId"];
             break;
 
         case recordTypes.Paint:
+            this._invalidationTracker.setCurrentPaint(event);
             event.highlightQuad = event.args["data"]["clip"];
             event.backendNodeId = event.args["data"]["nodeId"];
             var layerUpdateEvent = this._findAncestorEvent(recordTypes.UpdateLayer);
             if (!layerUpdateEvent || layerUpdateEvent.args["layerTreeId"] !== this._inspectedTargetLayerTreeId)
                 break;
             // Only keep layer paint events, skip paints for subframes that get painted to the same layer as parent.
             if (!event.args["data"]["layerId"])
                 break;
             this._lastPaintForLayer[layerUpdateEvent.args["layerId"]] = event;
             break;
@@ skipping 467 matching lines @@
     },
 
     _didWriteNextChunk: function(stream)
     {
         if (this._recordIndex === this._payloads.length)
             stream.close();
         else
             this._writeNextChunk(stream);
     }
 }
+
+/**
+ * TODO: Properly doc this class.
+ *
+ * Track style, layout, and paint invalidation events.
+ *
+ * As style or layout tracking invalidation events come in, they should be
+ *   registered here with add{Style,Layout}Invalidation.
+ * When a paint event occurs (not invalidation tracking event), setCurrentPaint
+ *   should be called.
+ * As paint tracking invalidation events come in, they should be registered
+ *   here with addPaintInvalidation. This function will annote the correct
+ *   paint event with style and layout invalidations.
+ *
+ * This class assumes events will come in the following order (expressed in pdr-bnf):
+ *   1) (one or more) layout or style invalidation tracking events.
+ *   2) (one or more) paint event followed by one or more paint invalidation tracking events.
+ */
+WebInspector.InvalidationTracker = function()
+{
+    // Invalidation events for the current frame.
+    this._styleTrackingEvents = {};
+    this._layoutTrackingEvents = {};
+
+    // Invalidation events for the currently painting frame.
+    // FIXME: these maps grow over time and need to be cleared after the frame ends.
+    this._paintingStyleInvalidationMap = {};
+    this._paintingLayoutInvalidationMap = {};
+
+    this._currentPaintEvent = undefined;
+}
+
+WebInspector.InvalidationTracker.prototype = {
+
+    addStyleInvalidation: function(invalidation)
+    {
+        this._currentPaintEvent = undefined;
+
+        var frameId = invalidation.frameId;
+        if (this._styleTrackingEvents[frameId] === undefined)
+            this._styleTrackingEvents[frameId] = [];
+        this._styleTrackingEvents[frameId].push(invalidation);
+    },
+
+    addLayoutInvalidation: function(invalidation)
+    {
+        this._currentPaintEvent = undefined;
+
+        var frameId = invalidation.frameId;
+        if (this._layoutTrackingEvents[frameId] === undefined)
+            this._layoutTrackingEvents[frameId] = [];
+        this._layoutTrackingEvents[frameId].push(invalidation);
+    },
+
+    addPaintInvalidation: function(invalidation)
+    {
+        var frameId = invalidation.frameId;
+        var paintEvent = this._currentPaintEvent;
+
+        if (paintEvent === undefined) {
+            console.warn("Received paint event with no style or layout invalidations.");
+            return;
+        }
+
+        var styleNodeIdMap = this._paintingStyleInvalidationMap[frameId];
+        if (styleNodeIdMap && styleNodeIdMap[invalidation.nodeId]) {
+            styleNodeIdMap[invalidation.nodeId].forEach(function(styleEvent) {
+                if (paintEvent.styleInvalidationTrackingEvents.indexOf(styleEvent) == -1)
+                    paintEvent.styleInvalidationTrackingEvents.push(styleEvent);
+            });
+        }
+        var layoutNodeIdMap = this._paintingLayoutInvalidationMap[frameId];
+        if (layoutNodeIdMap && layoutNodeIdMap[invalidation.nodeId]) {
+            layoutNodeIdMap[invalidation.nodeId].forEach(function(layoutEvent) {
+                if (paintEvent.layoutInvalidationTrackingEvents.indexOf(layoutEvent) == -1)
+                    paintEvent.layoutInvalidationTrackingEvents.push(layoutEvent);
+            });
+        }
+    },
+
+    setCurrentPaint: function(event)
+    {
+        this._startNewFrameIfNeeded(event.args.data.frame);
+
+        event.styleInvalidationTrackingEvents = [];
+        event.layoutInvalidationTrackingEvents = [];
+        this._currentPaintEvent = event;
+    },
+
+    // If there's a new frame, save off all current invalidations.
+    _startNewFrameIfNeeded: function(frameId)
+    {
+        // FIXME: Need to track compositor events as well, as they can cause
+        //        paints without style or layout invalidating. For now, we
+        //        assume that the existance of style or layout invalidations
+        //        after paint begins indicates a new frame has started.
+        if (this._styleTrackingEvents[frameId] === undefined &&
+            this._layoutTrackingEvents[frameId] === undefined)
+            return;
+
+        var styleTrackingEvents = this._styleTrackingEvents[frameId] || [];
+        var layoutTrackingEvents = this._layoutTrackingEvents[frameId] || [];
+        this._styleTrackingEvents[frameId] = undefined;
+        this._layoutTrackingEvents[frameId] = undefined;
+
+        var styleInvalidationMap = {};
+        styleTrackingEvents.forEach(function(styleEvent) {
+            if (styleInvalidationMap[styleEvent.nodeId] === undefined)
+                styleInvalidationMap[styleEvent.nodeId] = [];
+            styleInvalidationMap[styleEvent.nodeId].push(styleEvent);
+        });
+        this._paintingStyleInvalidationMap[frameId] = styleInvalidationMap;
+
+        var layoutInvalidationMap = {};
+        layoutTrackingEvents.forEach(function(layoutEvent) {
+            if (layoutInvalidationMap[layoutEvent.nodeId] === undefined)
+                layoutInvalidationMap[layoutEvent.nodeId] = [];
+            layoutInvalidationMap[layoutEvent.nodeId].push(layoutEvent);
+        });
+        this._paintingLayoutInvalidationMap[frameId] = layoutInvalidationMap;
+    }
+}