chrome-devtools-frontend 1.0.1362775 → 1.0.1376716

package/front_end/entrypoints/heap_snapshot_worker/HeapSnapshot.ts

@@ -35,7 +35,7 @@ import * as Platform from '../../core/platform/platform.js';
 import * as HeapSnapshotModel from '../../models/heap_snapshot_model/heap_snapshot_model.js';
 
 import {AllocationProfile} from './AllocationProfile.js';
-import {type HeapSnapshotWorkerDispatcher} from './HeapSnapshotWorkerDispatcher.js';
+import type {HeapSnapshotWorkerDispatcher} from './HeapSnapshotWorkerDispatcher.js';
 
 export interface HeapSnapshotItem {
   itemIndex(): number;
@@ -365,6 +365,27 @@ export class HeapSnapshotNode implements HeapSnapshotItem {
     return this.#detachednessAndClassIndex() >>> SHIFT_FOR_CLASS_INDEX;
   }
 
+  // Returns a key which can uniquely describe both the class name for this node
+  // and its Location, if relevant. These keys are meant to be cheap to produce,
+  // so that building aggregates is fast. These keys are NOT the same as the
+  // keys exposed to the frontend by functions such as aggregatesWithFilter and
+  // aggregatesForDiff.
+  classKeyInternal(): string|number {
+    // It is common for multiple JavaScript constructors to have the same
+    // name, so the class key includes the location if available for nodes of
+    // type 'object'.
+    //
+    // JavaScript Functions (node type 'closure') also have locations, but it
+    // would not be helpful to split them into categories by location because
+    // many of those categories would have only one instance.
+    if (this.rawType() !== this.snapshot.nodeObjectType) {
+      return this.classIndex();
+    }
+    const location = this.snapshot.getLocation(this.nodeIndex);
+    return location ? `${location.scriptId},${location.lineNumber},${location.columnNumber},${this.className()}` :
+                      this.classIndex();
+  }
+
   setClassIndex(index: number): void {
     let value = this.#detachednessAndClassIndex();
     value &= BITMASK_FOR_DOM_LINK_STATE;        // Clear previous class index.
@@ -886,8 +907,6 @@ export abstract class HeapSnapshot {
     this.retainingEdges = new Uint32Array(this.#edgeCount);
     this.firstRetainerIndex = new Uint32Array(this.nodeCount + 1);
     this.nodeDistances = new Int32Array(this.nodeCount);
-    this.firstDominatedNodeIndex = new Uint32Array(this.nodeCount + 1);
-    this.dominatedNodes = new Uint32Array(this.nodeCount - 1);
 
     this.#progress.updateStatus('Building edge indexes…');
     this.buildEdgeIndexes();
@@ -904,6 +923,8 @@ export abstract class HeapSnapshot {
     this.#progress.updateStatus('Calculating retained sizes…');
     this.buildDominatorTreeAndCalculateRetainedSizes();
     this.#progress.updateStatus('Building dominated nodes…');
+    this.firstDominatedNodeIndex = new Uint32Array(this.nodeCount + 1);
+    this.dominatedNodes = new Uint32Array(this.nodeCount - 1);
     this.buildDominatedNodes();
     this.#progress.updateStatus('Calculating object names…');
     this.calculateObjectNames();
@@ -1119,7 +1140,7 @@ export abstract class HeapSnapshot {
     const filter = this.createFilter(nodeFilter);
     // @ts-ignore key is added in createFilter
     const key = filter ? filter.key : 'allObjects';
-    return this.getAggregatesByClassName(false, key, filter);
+    return this.getAggregatesByClassKey(false, key, filter);
   }
 
   private createNodeIdFilter(minNodeId: number, maxNodeId: number): (arg0: HeapSnapshotNode) => boolean {
@@ -1234,29 +1255,39 @@ export abstract class HeapSnapshot {
     throw new Error('Invalid filter name');
   }
 
-  getAggregatesByClassName(sortedIndexes: boolean, key?: string, filter?: ((arg0: HeapSnapshotNode) => boolean)):
+  getAggregatesByClassKey(sortedIndexes: boolean, key?: string, filter?: ((arg0: HeapSnapshotNode) => boolean)):
       {[x: string]: HeapSnapshotModel.HeapSnapshotModel.Aggregate} {
-    const aggregates = this.buildAggregates(filter);
-
-    let aggregatesByClassName;
+    let aggregates: {[x: string]: HeapSnapshotModel.HeapSnapshotModel.Aggregate};
     if (key && this.#aggregates[key]) {
-      aggregatesByClassName = this.#aggregates[key];
+      aggregates = this.#aggregates[key];
     } else {
-      this.calculateClassesRetainedSize(aggregates.aggregatesByClassIndex, filter);
-      aggregatesByClassName = aggregates.aggregatesByClassName;
+      const aggregatesMap = this.buildAggregates(filter);
+      this.calculateClassesRetainedSize(aggregatesMap, filter);
+
+      // In the two previous steps, we used class keys that were simple and
+      // could be produced quickly. For many objects, this meant using the index
+      // of the string containing its class name. However, string indices are
+      // not consistent across snapshots, and this aggregate data might end up
+      // being used in a comparison, so here we convert to a more durable format
+      // for class keys.
+      aggregates = Object.create(null);
+      for (const [classKey, aggregate] of aggregatesMap.entries()) {
+        const newKey = this.classKeyFromClassKeyInternal(classKey);
+        aggregates[newKey] = aggregate;
+      }
       if (key) {
-        this.#aggregates[key] = aggregatesByClassName;
+        this.#aggregates[key] = aggregates;
       }
     }
 
     if (sortedIndexes && (!key || !this.#aggregatesSortedFlags[key])) {
-      this.sortAggregateIndexes(aggregatesByClassName);
+      this.sortAggregateIndexes(aggregates);
       if (key) {
         this.#aggregatesSortedFlags[key] = sortedIndexes;
       }
     }
 
-    return aggregatesByClassName as {
+    return aggregates as {
       [x: string]: HeapSnapshotModel.HeapSnapshotModel.Aggregate,
     };
   }
@@ -1286,13 +1317,13 @@ export abstract class HeapSnapshot {
     // Temporarily apply the interface definitions from the other snapshot.
     const originalInterfaceDefinitions = this.#interfaceDefinitions;
     this.applyInterfaceDefinitions(JSON.parse(interfaceDefinitions) as InterfaceDefinition[]);
-    const aggregatesByClassName = this.getAggregatesByClassName(true, 'allObjects');
+    const aggregates = this.getAggregatesByClassKey(true, 'allObjects');
     this.applyInterfaceDefinitions(originalInterfaceDefinitions ?? []);
     const result: {[x: string]: HeapSnapshotModel.HeapSnapshotModel.AggregateForDiff} = {};
 
     const node = this.createNode();
-    for (const className in aggregatesByClassName) {
-      const aggregate = aggregatesByClassName[className];
+    for (const classKey in aggregates) {
+      const aggregate = aggregates[classKey];
       const indexes = aggregate.idxs;
       const ids = new Array(indexes.length);
       const selfSizes = new Array(indexes.length);
@@ -1302,7 +1333,7 @@ export abstract class HeapSnapshot {
         selfSizes[i] = node.selfSize();
       }
 
-      result[className] = {indexes, ids, selfSizes};
+      result[classKey] = {indexes, ids, selfSizes};
     }
 
     this.#aggregatesForDiffInternal = {interfaceDefinitions, aggregates: result};
@@ -1406,13 +1437,9 @@ export abstract class HeapSnapshot {
     }
   }
 
-  private buildAggregates(filter?: ((arg0: HeapSnapshotNode) => boolean)):
-      {aggregatesByClassName: {[x: string]: AggregatedInfo}, aggregatesByClassIndex: {[x: number]: AggregatedInfo}} {
-    const aggregates: {[x: number]: AggregatedInfo} = {};
+  private buildAggregates(filter?: ((arg0: HeapSnapshotNode) => boolean)): Map<string|number, AggregatedInfo> {
+    const aggregates = new Map<string|number, AggregatedInfo>();
 
-    const aggregatesByClassName: {[x: string]: AggregatedInfo} = {};
-
-    const classIndexes = [];
     const nodes = this.nodes;
     const nodesLength = nodes.length;
     const nodeFieldCount = this.nodeFieldCount;
@@ -1429,58 +1456,45 @@ export abstract class HeapSnapshot {
       if (!selfSize) {
         continue;
       }
-      const classIndex = node.classIndex();
+      const classKey = node.classKeyInternal();
       const nodeOrdinal = nodeIndex / nodeFieldCount;
       const distance = nodeDistances[nodeOrdinal];
-      if (!(classIndex in aggregates)) {
-        const nodeType = node.type();
-        const nameMatters = nodeType === 'object' || nodeType === 'native';
-        const value = {
+      let aggregate = aggregates.get(classKey);
+      if (!aggregate) {
+        aggregate = {
           count: 1,
           distance,
           self: selfSize,
           maxRet: 0,
-          type: nodeType,
-          name: nameMatters ? node.className() : null,
+          name: node.className(),
           idxs: [nodeIndex],
         };
-        aggregates[classIndex] = value;
-        classIndexes.push(classIndex);
-        aggregatesByClassName[node.className()] = value;
+        aggregates.set(classKey, aggregate);
       } else {
-        const clss = aggregates[classIndex];
-        if (!clss) {
-          continue;
-        }
-        clss.distance = Math.min(clss.distance, distance);
-        ++clss.count;
-        clss.self += selfSize;
-        clss.idxs.push(nodeIndex);
+        aggregate.distance = Math.min(aggregate.distance, distance);
+        ++aggregate.count;
+        aggregate.self += selfSize;
+        aggregate.idxs.push(nodeIndex);
       }
     }
 
     // Shave off provisionally allocated space.
-    for (let i = 0, l = classIndexes.length; i < l; ++i) {
-      const classIndex = classIndexes[i];
-      const classIndexValues = aggregates[classIndex];
-      if (!classIndexValues) {
-        continue;
-      }
-      classIndexValues.idxs = classIndexValues.idxs.slice();
+    for (const aggregate of aggregates.values()) {
+      aggregate.idxs = aggregate.idxs.slice();
     }
 
-    return {aggregatesByClassName, aggregatesByClassIndex: aggregates};
+    return aggregates;
   }
 
   private calculateClassesRetainedSize(
-      aggregates: {[x: number]: AggregatedInfo}, filter?: ((arg0: HeapSnapshotNode) => boolean)): void {
+      aggregates: Map<string|number, AggregatedInfo>, filter?: ((arg0: HeapSnapshotNode) => boolean)): void {
     const rootNodeIndex = this.rootNodeIndexInternal;
     const node = this.createNode(rootNodeIndex);
     const list = [rootNodeIndex];
     const sizes = [-1];
-    const classes = [];
+    const classKeys: (string|number)[] = [];
 
-    const seenClassNameIndexes = new Map<number, boolean>();
+    const seenClassKeys = new Map<string|number, boolean>();
     const nodeFieldCount = this.nodeFieldCount;
     const dominatedNodes = this.dominatedNodes;
     const firstDominatedNodeIndex = this.firstDominatedNodeIndex;
@@ -1488,18 +1502,18 @@ export abstract class HeapSnapshot {
     while (list.length) {
       const nodeIndex = (list.pop() as number);
       node.nodeIndex = nodeIndex;
-      let classIndex = node.classIndex();
-      const seen = Boolean(seenClassNameIndexes.get(classIndex));
+      let classKey = node.classKeyInternal();
+      const seen = Boolean(seenClassKeys.get(classKey));
       const nodeOrdinal = nodeIndex / nodeFieldCount;
       const dominatedIndexFrom = firstDominatedNodeIndex[nodeOrdinal];
       const dominatedIndexTo = firstDominatedNodeIndex[nodeOrdinal + 1];
 
       if (!seen && (!filter || filter(node)) && node.selfSize()) {
-        aggregates[classIndex].maxRet += node.retainedSize();
+        (aggregates.get(classKey) as AggregatedInfo).maxRet += node.retainedSize();
         if (dominatedIndexFrom !== dominatedIndexTo) {
-          seenClassNameIndexes.set(classIndex, true);
+          seenClassKeys.set(classKey, true);
           sizes.push(list.length);
-          classes.push(classIndex);
+          classKeys.push(classKey);
         }
       }
       for (let i = dominatedIndexFrom; i < dominatedIndexTo; i++) {
@@ -1509,8 +1523,8 @@ export abstract class HeapSnapshot {
       const l = list.length;
       while (sizes[sizes.length - 1] === l) {
         sizes.pop();
-        classIndex = (classes.pop() as number);
-        seenClassNameIndexes.set(classIndex, false);
+        classKey = (classKeys.pop() as string);
+        seenClassKeys.set(classKey, false);
       }
     }
   }
@@ -1545,7 +1559,7 @@ export abstract class HeapSnapshot {
   }
 
   private computeIsEssentialEdge(
-      nodeIndex: number, edgeIndex: number, userObjectsMapAndFlag: {map: Uint32Array, flag: number}|null): boolean {
+      nodeIndex: number, edgeIndex: number, userObjectsMapAndFlag: {map: Uint8Array, flag: number}|null): boolean {
     const edgeType = this.containmentEdges.getValue(edgeIndex + this.edgeTypeOffset);
 
     // Values in WeakMaps are retained by the key and table together. Removing
@@ -2412,7 +2426,7 @@ export abstract class HeapSnapshot {
     throw new Error('Not implemented');
   }
 
-  userObjectsMapAndFlag(): {map: Uint32Array, flag: number}|null {
+  userObjectsMapAndFlag(): {map: Uint8Array, flag: number}|null {
     throw new Error('Not implemented');
   }
 
@@ -2430,22 +2444,22 @@ export abstract class HeapSnapshot {
       [x: string]: HeapSnapshotModel.HeapSnapshotModel.Diff,
     });
 
-    const aggregates = this.getAggregatesByClassName(true, 'allObjects');
-    for (const className in baseSnapshotAggregates) {
-      const baseAggregate = baseSnapshotAggregates[className];
-      const diff = this.calculateDiffForClass(baseAggregate, aggregates[className]);
+    const aggregates = this.getAggregatesByClassKey(true, 'allObjects');
+    for (const classKey in baseSnapshotAggregates) {
+      const baseAggregate = baseSnapshotAggregates[classKey];
+      const diff = this.calculateDiffForClass(baseAggregate, aggregates[classKey]);
       if (diff) {
-        snapshotDiff[className] = diff;
+        snapshotDiff[classKey] = diff;
       }
     }
     const emptyBaseAggregate = new HeapSnapshotModel.HeapSnapshotModel.AggregateForDiff();
-    for (const className in aggregates) {
-      if (className in baseSnapshotAggregates) {
+    for (const classKey in aggregates) {
+      if (classKey in baseSnapshotAggregates) {
         continue;
       }
-      const classDiff = this.calculateDiffForClass(emptyBaseAggregate, aggregates[className]);
+      const classDiff = this.calculateDiffForClass(emptyBaseAggregate, aggregates[classKey]);
       if (classDiff) {
-        snapshotDiff[className] = classDiff;
+        snapshotDiff[classKey] = classDiff;
       }
     }
 
@@ -2466,7 +2480,7 @@ export abstract class HeapSnapshot {
     let j = 0;
     const l = baseIds.length;
     const m = indexes.length;
-    const diff = new HeapSnapshotModel.HeapSnapshotModel.Diff();
+    const diff = new HeapSnapshotModel.HeapSnapshotModel.Diff(aggregate.name);
 
     const nodeB = this.createNode(indexes[j]);
     while (i < l && j < m) {
@@ -2517,10 +2531,17 @@ export abstract class HeapSnapshot {
     return null;
   }
 
-  nodeClassName(snapshotObjectId: number): string|null {
+  // Converts an internal class key, suitable for categorizing within this
+  // snapshot, to a public class key, which can be used in comparisons
+  // between multiple snapshots.
+  classKeyFromClassKeyInternal(key: string|number): string {
+    return typeof key === 'number' ? (',' + this.strings[key]) : key;
+  }
+
+  nodeClassKey(snapshotObjectId: number): string|null {
     const node = this.nodeForSnapshotObjectId(snapshotObjectId);
     if (node) {
-      return node.className();
+      return this.classKeyFromClassKeyInternal(node.classKeyInternal());
     }
     return null;
   }
@@ -2564,9 +2585,9 @@ export abstract class HeapSnapshot {
     return new HeapSnapshotEdgesProvider(this, filter, node.retainers(), indexProvider);
   }
 
-  createAddedNodesProvider(baseSnapshotId: string, className: string): HeapSnapshotNodesProvider {
+  createAddedNodesProvider(baseSnapshotId: string, classKey: string): HeapSnapshotNodesProvider {
     const snapshotDiff = this.#snapshotDiffs[baseSnapshotId];
-    const diffForClass = snapshotDiff[className];
+    const diffForClass = snapshotDiff[classKey];
     return new HeapSnapshotNodesProvider(this, diffForClass.addedIndexes);
   }
 
@@ -2574,9 +2595,9 @@ export abstract class HeapSnapshot {
     return new HeapSnapshotNodesProvider(this, nodeIndexes);
   }
 
-  createNodesProviderForClass(className: string, nodeFilter: HeapSnapshotModel.HeapSnapshotModel.NodeFilter):
+  createNodesProviderForClass(classKey: string, nodeFilter: HeapSnapshotModel.HeapSnapshotModel.NodeFilter):
       HeapSnapshotNodesProvider {
-    return new HeapSnapshotNodesProvider(this, this.aggregatesWithFilter(nodeFilter)[className].idxs);
+    return new HeapSnapshotNodesProvider(this, this.aggregatesWithFilter(nodeFilter)[classKey].idxs);
   }
 
   private maxJsNodeId(): number {
@@ -3030,18 +3051,18 @@ export class HeapSnapshotNodesProvider extends HeapSnapshotItemProvider {
 
 export class JSHeapSnapshot extends HeapSnapshot {
   readonly nodeFlags: {
-    // bit flags
+    // bit flags in 8-bit value
     canBeQueried: number,
     detachedDOMTreeNode: number,
     pageObject:
         number,  // The idea is to track separately the objects owned by the page and the objects owned by debugger.
   };
-  private flags!: Uint32Array;
+  private flags!: Uint8Array;
   #statistics?: HeapSnapshotModel.HeapSnapshotModel.Statistics;
   constructor(profile: Profile, progress: HeapSnapshotProgress) {
     super(profile, progress);
     this.nodeFlags = {
-      // bit flags
+      // bit flags in 8-bit value
       canBeQueried: 1,
       detachedDOMTreeNode: 2,
       pageObject:
@@ -3075,7 +3096,7 @@ export class JSHeapSnapshot extends HeapSnapshot {
   }
 
   override calculateFlags(): void {
-    this.flags = new Uint32Array(this.nodeCount);
+    this.flags = new Uint8Array(this.nodeCount);
     this.markDetachedDOMTreeNodes();
     this.markQueriableHeapObjects();
     this.markPageOwnedNodes();
@@ -3241,7 +3262,7 @@ export class JSHeapSnapshot extends HeapSnapshot {
     return node.isUserRoot() || node.isDocumentDOMTreesRoot();
   }
 
-  override userObjectsMapAndFlag(): {map: Uint32Array, flag: number}|null {
+  override userObjectsMapAndFlag(): {map: Uint8Array, flag: number}|null {
     return {map: this.flags, flag: this.nodeFlags.pageObject};
   }
 
@@ -3285,7 +3306,7 @@ export class JSHeapSnapshot extends HeapSnapshot {
     const nodeFieldCount = this.nodeFieldCount;
     const firstEdgeIndexes = this.firstEdgeIndexes;
 
-    const flags = (this.flags as Uint32Array);
+    const flags = this.flags;
     const list: number[] = [];
 
     for (let iter = this.rootNode().edges(); iter.hasNext(); iter.next()) {
@@ -3330,7 +3351,7 @@ export class JSHeapSnapshot extends HeapSnapshot {
     const nodeFieldCount = this.nodeFieldCount;
     const nodesCount = this.nodeCount;
 
-    const flags = (this.flags as Uint32Array);
+    const flags = this.flags;
     const pageObjectFlag = this.nodeFlags.pageObject;
 
     const nodesToVisit = new Uint32Array(nodesCount);
@@ -3771,6 +3792,6 @@ export interface AggregatedInfo {
   distance: number;
   self: number;
   maxRet: number;
-  name: string|null;
+  name: string;
   idxs: number[];
 }

package/front_end/entrypoints/heap_snapshot_worker/HeapSnapshotLoader.ts

@@ -32,7 +32,7 @@ import * as Platform from '../../core/platform/platform.js';
 import * as TextUtils from '../../models/text_utils/text_utils.js';
 
 import {type HeapSnapshotHeader, HeapSnapshotProgress, JSHeapSnapshot, type Profile} from './HeapSnapshot.js';
-import {type HeapSnapshotWorkerDispatcher} from './HeapSnapshotWorkerDispatcher.js';
+import type {HeapSnapshotWorkerDispatcher} from './HeapSnapshotWorkerDispatcher.js';
 
 export class HeapSnapshotLoader {
   readonly #progress: HeapSnapshotProgress;

package/front_end/entrypoints/main/MainImpl.ts

@@ -387,7 +387,6 @@ export class MainImpl {
     Root.Runtime.experiments.register(
         Root.Runtime.ExperimentName.TIMELINE_INSIGHTS,
         'Performance panel: enable performance insights',
-        true,
     );
 
     Root.Runtime.experiments.register(
@@ -405,12 +404,33 @@ export class MainImpl {
         'Extension storage in Application panel',
     );
 
+    Root.Runtime.experiments.register(
+        Root.Runtime.ExperimentName.FLOATING_ENTRY_POINTS_FOR_AI_ASSISTANCE,
+        'Floating entry points for the AI assistance panel');
+
+    Root.Runtime.experiments.register(
+        Root.Runtime.ExperimentName.TIMELINE_EXPERIMENTAL_INSIGHTS,
+        'Performance panel: enable experimental performance insights',
+    );
+
+    Root.Runtime.experiments.register(
+        Root.Runtime.ExperimentName.TIMELINE_DIM_UNRELATED_EVENTS,
+        'Performance panel: enable dimming unrelated events in performance insights and search results',
+    );
+
+    Root.Runtime.experiments.register(
+        Root.Runtime.ExperimentName.TIMELINE_ALTERNATIVE_NAVIGATION,
+        'Performance panel: enable a switch to an alternative timeline navigation option',
+    );
+
     Root.Runtime.experiments.enableExperimentsByDefault([
       'css-type-component-length-deprecate',
       Root.Runtime.ExperimentName.AUTOFILL_VIEW,
+      Root.Runtime.ExperimentName.TIMELINE_INSIGHTS,
       Root.Runtime.ExperimentName.TIMELINE_OBSERVATIONS,
       Root.Runtime.ExperimentName.TIMELINE_ANNOTATIONS,
       Root.Runtime.ExperimentName.NETWORK_PANEL_FILTER_BAR_REDESIGN,
+      Root.Runtime.ExperimentName.FLOATING_ENTRY_POINTS_FOR_AI_ASSISTANCE,
       ...(Root.Runtime.Runtime.queryParam('isChromeForTesting') ? ['protocol-monitor'] : []),
     ]);