Bug 1191508 part 2: Count allocations on the client side so the count accurately reflects the selection in performance tools. r=shu

browser/devtools/performance/modules/logic/frame-utils.js

@@ -242,12 +242,11 @@ function getInflatedFrameCache(frameTable) {
  * @param number index
  * @param object frameTable
  * @param object stringTable
- * @param object allocationsTable
  */
-function getOrAddInflatedFrame(cache, index, frameTable, stringTable, allocationsTable) {
+function getOrAddInflatedFrame(cache, index, frameTable, stringTable) {
   let inflatedFrame = cache[index];
   if (inflatedFrame === null) {
-    inflatedFrame = cache[index] = new InflatedFrame(index, frameTable, stringTable, allocationsTable);
+    inflatedFrame = cache[index] = new InflatedFrame(index, frameTable, stringTable);
   }
   return inflatedFrame;
 };
@@ -258,9 +257,8 @@ function getOrAddInflatedFrame(cache, index, frameTable, stringTable, allocation
  * @param number index
  * @param object frameTable
  * @param object stringTable
- * @param object allocationsTable
  */
-function InflatedFrame(index, frameTable, stringTable, allocationsTable) {
+function InflatedFrame(index, frameTable, stringTable) {
   const LOCATION_SLOT = frameTable.schema.location;
   const IMPLEMENTATION_SLOT = frameTable.schema.implementation;
   const OPTIMIZATIONS_SLOT = frameTable.schema.optimizations;
@@ -274,7 +272,6 @@ function InflatedFrame(index, frameTable, stringTable, allocationsTable) {
   this.optimizations = frame[OPTIMIZATIONS_SLOT];
   this.line = frame[LINE_SLOT];
   this.column = undefined;
-  this.allocations = allocationsTable ? allocationsTable[index] : 0;
   this.category = category;
   this.isContent = false;
 
@@ -505,10 +502,10 @@ function getFrameInfo (node, options) {
     data.COSTS_CALCULATED = true;
   }
 
-  if (options && options.allocations && !data.ALLOCATIONS_CALCULATED) {
+  if (options && options.allocations && !data.ALLOCATION_DATA_CALCULATED) {
-    data.totalAllocations = node.allocations + node.calls.reduce((acc, node) => acc + node.allocations, 0);
+    data.selfCount = node.youngestFrameSamples;
-    data.selfAllocations = node.allocations;
+    data.totalCount = node.samples;
-    data.ALLOCATIONS_CALCULATED = true;
+    data.ALLOCATION_DATA_CALCULATED = true;
   }
 
   return data;

browser/devtools/performance/modules/logic/tree-model.js

@@ -37,14 +37,14 @@ function ThreadNode(thread, options = {}) {
   this.duration = options.endTime - options.startTime;
   this.nodeType = "Thread";
 
-  let { samples, stackTable, frameTable, stringTable, allocationsTable } = thread;
+  let { samples, stackTable, frameTable, stringTable } = thread;
 
   // Nothing to do if there are no samples.
   if (samples.data.length === 0) {
     return;
   }
 
-  this._buildInverted(samples, stackTable, frameTable, stringTable, allocationsTable, options);
+  this._buildInverted(samples, stackTable, frameTable, stringTable, options);
   if (!options.invertTree) {
     this._uninvert();
   }
@@ -67,9 +67,6 @@ ThreadNode.prototype = {
    *        The table of deduplicated frames from the backend.
    * @param object stringTable
    *        The table of deduplicated strings from the backend.
-   * @param object allocationsTable
-   *        The table of allocation counts from the backend. Indexed by frame
-   *        index.
    * @param object options
    *        Additional supported options
    *          - number startTime
@@ -77,7 +74,7 @@ ThreadNode.prototype = {
    *          - boolean contentOnly [optional]
    *          - boolean invertTree [optional]
    */
-  _buildInverted: function buildInverted(samples, stackTable, frameTable, stringTable, allocationsTable, options) {
+  _buildInverted: function buildInverted(samples, stackTable, frameTable, stringTable, options) {
     function getOrAddFrameNode(calls, isLeaf, frameKey, inflatedFrame, isMetaCategory, leafTable) {
       // Insert the inflated frame into the call tree at the current level.
       let frameNode;
@@ -203,7 +200,7 @@ ThreadNode.prototype = {
 
         // Inflate the frame.
         let inflatedFrame = getOrAddInflatedFrame(inflatedFrameCache, frameIndex, frameTable,
-                                                  stringTable, allocationsTable);
+                                                  stringTable);
 
         // Compute the frame key.
         mutableFrameKeyOptions.isRoot = stackIndex === null;
@@ -382,11 +379,10 @@ ThreadNode.prototype = {
  *        Whether or not this is a platform node that should appear as a
  *        generalized meta category or not.
  */
-function FrameNode(frameKey, { location, line, category, allocations, isContent }, isMetaCategory) {
+function FrameNode(frameKey, { location, line, category, isContent }, isMetaCategory) {
   this.key = frameKey;
   this.location = location;
   this.line = line;
-  this.allocations = allocations;
   this.youngestFrameSamples = 0;
   this.samples = 0;
   this.calls = [];

browser/devtools/performance/modules/widgets/tree-view.js

@@ -37,10 +37,10 @@ const DEFAULT_AUTO_EXPAND_DEPTH = 3; // depth
 const DEFAULT_VISIBLE_CELLS = {
   duration: true,
   percentage: true,
-  allocations: false,
+  count: false,
   selfDuration: true,
   selfPercentage: true,
-  selfAllocations: false,
+  selfCount: false,
   samples: true,
   function: true
 };
@@ -134,30 +134,31 @@ CallView.prototype = Heritage.extend(AbstractTreeItem.prototype, {
    */
   _displaySelf: function(document, arrowNode) {
     let frameInfo = this.getDisplayedData();
+    let cells = [];
 
     if (this.visibleCells.duration) {
-      var durationCell = this._createTimeCell(document, frameInfo.totalDuration);
+      cells.push(this._createTimeCell(document, frameInfo.totalDuration));
-    }
-    if (this.visibleCells.selfDuration) {
-      var selfDurationCell = this._createTimeCell(document, frameInfo.selfDuration, true);
     }
     if (this.visibleCells.percentage) {
-      var percentageCell = this._createExecutionCell(document, frameInfo.totalPercentage);
+      cells.push(this._createExecutionCell(document, frameInfo.totalPercentage));
+    }
+    if (this.visibleCells.count) {
+      cells.push(this._createCountCell(document, frameInfo.totalCount));
+    }
+    if (this.visibleCells.selfDuration) {
+      cells.push(this._createTimeCell(document, frameInfo.selfDuration, true));
     }
     if (this.visibleCells.selfPercentage) {
-      var selfPercentageCell = this._createExecutionCell(document, frameInfo.selfPercentage, true);
+      cells.push(this._createExecutionCell(document, frameInfo.selfPercentage, true));
     }
-    if (this.visibleCells.allocations) {
+    if (this.visibleCells.selfCount) {
-      var allocationsCell = this._createAllocationsCell(document, frameInfo.totalAllocations);
+      cells.push(this._createCountCell(document, frameInfo.selfCount, true));
-    }
-    if (this.visibleCells.selfAllocations) {
-      var selfAllocationsCell = this._createAllocationsCell(document, frameInfo.selfAllocations, true);
     }
     if (this.visibleCells.samples) {
-      var samplesCell = this._createSamplesCell(document, frameInfo.samples);
+      cells.push(this._createSamplesCell(document, frameInfo.samples));
     }
     if (this.visibleCells.function) {
-      var functionCell = this._createFunctionCell(document, arrowNode, frameInfo.name, frameInfo, this.level);
+      cells.push(this._createFunctionCell(document, arrowNode, frameInfo.name, frameInfo, this.level));
     }
 
     let targetNode = document.createElement("hbox");
@@ -169,29 +170,9 @@ CallView.prototype = Heritage.extend(AbstractTreeItem.prototype, {
     if (this.hidden) {
       targetNode.style.display = "none";
     }
-    if (this.visibleCells.duration) {
+
-      targetNode.appendChild(durationCell);
+    for (let i = 0; i < cells.length; i++) {
-    }
+      targetNode.appendChild(cells[i]);
-    if (this.visibleCells.percentage) {
-      targetNode.appendChild(percentageCell);
-    }
-    if (this.visibleCells.allocations) {
-      targetNode.appendChild(allocationsCell);
-    }
-    if (this.visibleCells.selfDuration) {
-      targetNode.appendChild(selfDurationCell);
-    }
-    if (this.visibleCells.selfPercentage) {
-      targetNode.appendChild(selfPercentageCell);
-    }
-    if (this.visibleCells.selfAllocations) {
-      targetNode.appendChild(selfAllocationsCell);
-    }
-    if (this.visibleCells.samples) {
-      targetNode.appendChild(samplesCell);
-    }
-    if (this.visibleCells.function) {
-      targetNode.appendChild(functionCell);
     }
 
     return targetNode;
@@ -239,10 +220,10 @@ CallView.prototype = Heritage.extend(AbstractTreeItem.prototype, {
     cell.setAttribute("value", L10N.numberWithDecimals(percentage, 2) + PERCENTAGE_UNITS);
     return cell;
   },
-  _createAllocationsCell: function(doc, count, isSelf = false) {
+  _createCountCell: function(doc, count, isSelf = false) {
     let cell = doc.createElement("description");
     cell.className = "plain call-tree-cell";
-    cell.setAttribute("type", isSelf ? "self-allocations" : "allocations");
+    cell.setAttribute("type", isSelf ? "self-count" : "count");
     cell.setAttribute("crop", "end");
     cell.setAttribute("value", count || 0);
     return cell;
@@ -356,7 +337,7 @@ CallView.prototype = Heritage.extend(AbstractTreeItem.prototype, {
 
     return this._cachedDisplayedData = this.frame.getInfo({
       root: this.root.frame,
-      allocations: (this.visibleCells.allocations || this.visibleCells.selfAllocations)
+      allocations: (this.visibleCells.count || this.visibleCells.selfCount)
     });
 
     /**

browser/devtools/performance/performance.xul

@@ -305,12 +305,12 @@
               <vbox id="memory-calltree-view" flex="1">
                 <hbox class="call-tree-headers-container">
                   <label class="plain call-tree-header"
-                         type="allocations"
+                         type="count"
                          crop="end"
                          value="&performanceUI.table.totalAlloc;"
                          tooltiptext="&performanceUI.table.totalAlloc.tooltip;"/>
                   <label class="plain call-tree-header"
-                         type="self-allocations"
+                         type="self-count"
                          crop="end"
                          value="&performanceUI.table.selfAlloc;"
                          tooltiptext="&performanceUI.table.selfAlloc.tooltip;"/>

browser/devtools/performance/test/browser_perf-columns-memory-calltree.js

@@ -12,7 +12,7 @@ function* spawnTest() {
   Services.prefs.setBoolPref(MEMORY_PREF, true);
 
   yield startRecording(panel);
-  yield busyWait(1000);
+  yield busyWait(100);
 
   let rendered = once(MemoryCallTreeView, EVENTS.MEMORY_CALL_TREE_RENDERED);
   yield stopRecording(panel);
@@ -23,10 +23,10 @@ function* spawnTest() {
   testCells($, $$, {
     "duration": false,
     "percentage": false,
-    "allocations": true,
+    "count": true,
     "self-duration": false,
     "self-percentage": false,
-    "self-allocations": true,
+    "self-count": true,
     "samples": false,
     "function": true
   });

browser/devtools/performance/views/details-memory-call-tree.js

@@ -96,8 +96,8 @@ let MemoryCallTreeView = Heritage.extend(DetailsSubview, {
       // Some cells like the time duration and cost percentage don't make sense
       // for a memory allocations call tree.
       visibleCells: {
-        allocations: true,
+        selfCount: true,
-        selfAllocations: true,
+        count: true,
         function: true
       }
     });

browser/devtools/performance/views/frames-list.js

@@ -101,7 +101,6 @@ let FramesListView = {
         }
         this._selectedItem = target;
         target.classList.add("selected");
-        console.log("Emitting select on", this, frame);
         this.emit("select", frame);
         break;
       }

browser/themes/shared/devtools/performance.css

@@ -221,10 +221,10 @@
   width: 4.5vw;
 }
 
-.call-tree-header[type="allocations"],
+.call-tree-header[type="count"],
-.call-tree-cell[type="allocations"],
+.call-tree-cell[type="count"],
-.call-tree-header[type="self-allocations"],
+.call-tree-header[type="self-count"],
-.call-tree-cell[type="self-allocations"] {
+.call-tree-cell[type="self-count"] {
   width: 9vw;
 }