@paulirish/trace_engine 0.0.9 → 0.0.11

package/models/trace/handlers/WarningsHandler.js

@@ -0,0 +1,125 @@
+// Copyright 2023 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.
+import * as Platform from '../../../core/platform/platform.js';
+import * as Helpers from '../helpers/helpers.js';
+import * as Types from '../types/types.js';
+import { data as userInteractionsHandlerData } from './UserInteractionsHandler.js';
+const warningsPerEvent = new Map();
+const eventsPerWarning = new Map();
+/**
+ * Tracks the stack formed by nested trace events up to a given point
+ */
+const allEventsStack = [];
+/**
+ * Tracks the stack formed by JS invocation trace events up to a given point.
+ * F.e. FunctionCall, EvaluateScript, V8Execute.
+ * Not to be confused with ProfileCalls.
+ */
+const jsInvokeStack = [];
+/**
+ * Tracks reflow events in a task.
+ */
+const taskReflowEvents = [];
+export const FORCED_REFLOW_THRESHOLD = Helpers.Timing.millisecondsToMicroseconds(Types.Timing.MilliSeconds(30));
+export const LONG_MAIN_THREAD_TASK_THRESHOLD = Helpers.Timing.millisecondsToMicroseconds(Types.Timing.MilliSeconds(50));
+export function reset() {
+    warningsPerEvent.clear();
+    eventsPerWarning.clear();
+    allEventsStack.length = 0;
+    jsInvokeStack.length = 0;
+    taskReflowEvents.length = 0;
+}
+function storeWarning(event, warning) {
+    const existingWarnings = Platform.MapUtilities.getWithDefault(warningsPerEvent, event, () => []);
+    existingWarnings.push(warning);
+    warningsPerEvent.set(event, existingWarnings);
+    const existingEvents = Platform.MapUtilities.getWithDefault(eventsPerWarning, warning, () => []);
+    existingEvents.push(event);
+    eventsPerWarning.set(warning, existingEvents);
+}
+export function handleEvent(event) {
+    processForcedReflowWarning(event);
+    if (event.name === "RunTask" /* Types.TraceEvents.KnownEventName.RunTask */) {
+        const { duration } = Helpers.Timing.eventTimingsMicroSeconds(event);
+        if (duration > LONG_MAIN_THREAD_TASK_THRESHOLD) {
+            storeWarning(event, 'LONG_TASK');
+        }
+        return;
+    }
+    if (Types.TraceEvents.isTraceEventFireIdleCallback(event)) {
+        const { duration } = Helpers.Timing.eventTimingsMilliSeconds(event);
+        if (duration > event.args.data.allottedMilliseconds) {
+            storeWarning(event, 'IDLE_CALLBACK_OVER_TIME');
+        }
+        return;
+    }
+}
+/**
+ * Reflows* are added a warning to if:
+ * 1. They are forced/sync, meaning they are invoked by JS and finish
+ *    during the Script execution.
+ * 2. Their duration exceeds a threshold.
+ * - *Reflow: The style recalculation and layout steps in a render task.
+ */
+function processForcedReflowWarning(event) {
+    // Update the event and the JS invocation stacks.
+    accomodateEventInStack(event, allEventsStack);
+    accomodateEventInStack(event, jsInvokeStack, /* pushEventToStack */ Types.TraceEvents.isJSInvocationEvent(event));
+    if (jsInvokeStack.length) {
+        // Current event falls inside a JS call.
+        if (event.name === "Layout" /* Types.TraceEvents.KnownEventName.Layout */ ||
+            event.name === "RecalculateStyles" /* Types.TraceEvents.KnownEventName.RecalculateStyles */ ||
+            event.name === "UpdateLayoutTree" /* Types.TraceEvents.KnownEventName.UpdateLayoutTree */) {
+            // A forced reflow happened. However we need to check if
+            // the threshold is surpassed to add a warning. Accumulate the
+            // event to check for this after the current Task is over.
+            taskReflowEvents.push(event);
+            return;
+        }
+    }
+    if (allEventsStack.length === 1) {
+        // We hit a new task. Check if the forced reflows in the previous
+        // task exceeded the threshold and add a warning if so.
+        const totalTime = taskReflowEvents.reduce((time, event) => time + (event.dur || 0), 0);
+        if (totalTime >= FORCED_REFLOW_THRESHOLD) {
+            taskReflowEvents.forEach(reflowEvent => storeWarning(reflowEvent, 'FORCED_REFLOW'));
+        }
+        taskReflowEvents.length = 0;
+    }
+}
+/**
+ * Updates a given trace event stack given a new event.
+ */
+function accomodateEventInStack(event, stack, pushEventToStack = true) {
+    let nextItem = stack.at(-1);
+    while (nextItem && event.ts > nextItem.ts + (nextItem.dur || 0)) {
+        stack.pop();
+        nextItem = stack.at(-1);
+    }
+    if (!pushEventToStack) {
+        return;
+    }
+    stack.push(event);
+}
+export function deps() {
+    return ['UserInteractions'];
+}
+export async function finalize() {
+    // These events do exist on the UserInteractionsHandler, but we also put
+    // them into the WarningsHandler so that the warnings handler can be the
+    // source of truth and the way to look up all warnings for a given event.
+    // Otherwise, we would have to look up warnings across multiple handlers for
+    // a given event, which will start to get messy very quickly.
+    const longInteractions = userInteractionsHandlerData().interactionsOverThreshold;
+    for (const interaction of longInteractions) {
+        storeWarning(interaction, 'LONG_INTERACTION');
+    }
+}
+export function data() {
+    return {
+        perEvent: new Map(warningsPerEvent),
+        perWarning: new Map(eventsPerWarning),
+    };
+}
+//# sourceMappingURL=WarningsHandler.js.map

package/models/trace/handlers/WarningsHandler.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"WarningsHandler.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/handlers/WarningsHandler.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright 2023 The Chromium Authors. All rights reserved.\n// Use of this source code is governed by a BSD-style license that can be\n// found in the LICENSE file.\n\nimport * as Platform from '../../../core/platform/platform.js';\nimport * as Helpers from '../helpers/helpers.js';\nimport * as Types from '../types/types.js';\n\nimport {type TraceEventHandlerName} from './types.js';\nimport {data as userInteractionsHandlerData} from './UserInteractionsHandler.js';\n\nexport interface WarningsData {\n  // Tracks warnings keyed by the event.\n  perEvent: Map<Types.TraceEvents.TraceEventData, Warning[]>;\n  // The same data in reverse: for each type of warning, track the events.\n  // Useful if we need to enumerate events by type of issue\n  perWarning: Map<Warning, Types.TraceEvents.TraceEventData[]>;\n}\n\nexport type Warning = 'LONG_TASK'|'IDLE_CALLBACK_OVER_TIME'|'FORCED_REFLOW'|'LONG_INTERACTION';\n\nconst warningsPerEvent: WarningsData['perEvent'] = new Map();\nconst eventsPerWarning: WarningsData['perWarning'] = new Map();\n\n/**\n * Tracks the stack formed by nested trace events up to a given point\n */\nconst allEventsStack: Types.TraceEvents.TraceEventData[] = [];\n/**\n * Tracks the stack formed by JS invocation trace events up to a given point.\n * F.e. FunctionCall, EvaluateScript, V8Execute.\n * Not to be confused with ProfileCalls.\n */\nconst jsInvokeStack: Types.TraceEvents.TraceEventData[] = [];\n/**\n * Tracks reflow events in a task.\n */\nconst taskReflowEvents: Types.TraceEvents.TraceEventData[] = [];\n\nexport const FORCED_REFLOW_THRESHOLD = Helpers.Timing.millisecondsToMicroseconds(Types.Timing.MilliSeconds(30));\n\nexport const LONG_MAIN_THREAD_TASK_THRESHOLD = Helpers.Timing.millisecondsToMicroseconds(Types.Timing.MilliSeconds(50));\n\nexport function reset(): void {\n  warningsPerEvent.clear();\n  eventsPerWarning.clear();\n  allEventsStack.length = 0;\n  jsInvokeStack.length = 0;\n  taskReflowEvents.length = 0;\n}\n\nfunction storeWarning(event: Types.TraceEvents.TraceEventData, warning: Warning): void {\n  const existingWarnings = Platform.MapUtilities.getWithDefault(warningsPerEvent, event, () => []);\n  existingWarnings.push(warning);\n  warningsPerEvent.set(event, existingWarnings);\n\n  const existingEvents = Platform.MapUtilities.getWithDefault(eventsPerWarning, warning, () => []);\n  existingEvents.push(event);\n  eventsPerWarning.set(warning, existingEvents);\n}\n\nexport function handleEvent(event: Types.TraceEvents.TraceEventData): void {\n  processForcedReflowWarning(event);\n  if (event.name === Types.TraceEvents.KnownEventName.RunTask) {\n    const {duration} = Helpers.Timing.eventTimingsMicroSeconds(event);\n    if (duration > LONG_MAIN_THREAD_TASK_THRESHOLD) {\n      storeWarning(event, 'LONG_TASK');\n    }\n    return;\n  }\n\n  if (Types.TraceEvents.isTraceEventFireIdleCallback(event)) {\n    const {duration} = Helpers.Timing.eventTimingsMilliSeconds(event);\n    if (duration > event.args.data.allottedMilliseconds) {\n      storeWarning(event, 'IDLE_CALLBACK_OVER_TIME');\n    }\n    return;\n  }\n}\n\n/**\n * Reflows* are added a warning to if:\n * 1. They are forced/sync, meaning they are invoked by JS and finish\n *    during the Script execution.\n * 2. Their duration exceeds a threshold.\n * - *Reflow: The style recalculation and layout steps in a render task.\n */\nfunction processForcedReflowWarning(event: Types.TraceEvents.TraceEventData): void {\n  // Update the event and the JS invocation stacks.\n  accomodateEventInStack(event, allEventsStack);\n  accomodateEventInStack(event, jsInvokeStack, /* pushEventToStack */ Types.TraceEvents.isJSInvocationEvent(event));\n  if (jsInvokeStack.length) {\n    // Current event falls inside a JS call.\n    if (event.name === Types.TraceEvents.KnownEventName.Layout ||\n        event.name === Types.TraceEvents.KnownEventName.RecalculateStyles ||\n        event.name === Types.TraceEvents.KnownEventName.UpdateLayoutTree) {\n      // A forced reflow happened. However we need to check if\n      // the threshold is surpassed to add a warning. Accumulate the\n      // event to check for this after the current Task is over.\n      taskReflowEvents.push(event);\n      return;\n    }\n  }\n  if (allEventsStack.length === 1) {\n    // We hit a new task. Check if the forced reflows in the previous\n    // task exceeded the threshold and add a warning if so.\n    const totalTime = taskReflowEvents.reduce((time, event) => time + (event.dur || 0), 0);\n    if (totalTime >= FORCED_REFLOW_THRESHOLD) {\n      taskReflowEvents.forEach(reflowEvent => storeWarning(reflowEvent, 'FORCED_REFLOW'));\n    }\n    taskReflowEvents.length = 0;\n  }\n}\n\n/**\n * Updates a given trace event stack given a new event.\n */\nfunction accomodateEventInStack(\n    event: Types.TraceEvents.TraceEventData, stack: Types.TraceEvents.TraceEventData[], pushEventToStack = true): void {\n  let nextItem = stack.at(-1);\n  while (nextItem && event.ts > nextItem.ts + (nextItem.dur || 0)) {\n    stack.pop();\n    nextItem = stack.at(-1);\n  }\n  if (!pushEventToStack) {\n    return;\n  }\n  stack.push(event);\n}\n\nexport function deps(): TraceEventHandlerName[] {\n  return ['UserInteractions'];\n}\n\nexport async function finalize(): Promise<void> {\n  // These events do exist on the UserInteractionsHandler, but we also put\n  // them into the WarningsHandler so that the warnings handler can be the\n  // source of truth and the way to look up all warnings for a given event.\n  // Otherwise, we would have to look up warnings across multiple handlers for\n  // a given event, which will start to get messy very quickly.\n  const longInteractions = userInteractionsHandlerData().interactionsOverThreshold;\n  for (const interaction of longInteractions) {\n    storeWarning(interaction, 'LONG_INTERACTION');\n  }\n}\n\nexport function data(): WarningsData {\n  return {\n    perEvent: new Map(warningsPerEvent),\n    perWarning: new Map(eventsPerWarning),\n  };\n}\n"]}

package/models/trace/handlers/WorkersHandler.d.ts

@@ -0,0 +1,11 @@
+import * as Types from '../types/types.js';
+export interface WorkersData {
+    workerSessionIdEvents: readonly Types.TraceEvents.TraceEventTracingSessionIdForWorker[];
+    workerIdByThread: Map<Types.TraceEvents.ThreadID, Types.TraceEvents.WorkerId>;
+    workerURLById: Map<Types.TraceEvents.WorkerId, string>;
+}
+export declare function initialize(): void;
+export declare function reset(): void;
+export declare function handleEvent(event: Types.TraceEvents.TraceEventData): void;
+export declare function finalize(): Promise<void>;
+export declare function data(): WorkersData;

package/models/trace/handlers/WorkersHandler.js

@@ -0,0 +1,52 @@
+// Copyright 2023 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.
+import * as Types from '../types/types.js';
+let handlerState = 1 /* HandlerState.UNINITIALIZED */;
+const sessionIdEvents = [];
+const workerIdByThread = new Map();
+const workerURLById = new Map();
+export function initialize() {
+    if (handlerState !== 1 /* HandlerState.UNINITIALIZED */) {
+        throw new Error('Workers Handler was not reset');
+    }
+    handlerState = 2 /* HandlerState.INITIALIZED */;
+}
+export function reset() {
+    sessionIdEvents.length = 0;
+    workerIdByThread.clear();
+    workerURLById.clear();
+    handlerState = 1 /* HandlerState.UNINITIALIZED */;
+}
+export function handleEvent(event) {
+    if (handlerState !== 2 /* HandlerState.INITIALIZED */) {
+        throw new Error('Workers Handler is not initialized');
+    }
+    if (Types.TraceEvents.isTraceEventTracingSessionIdForWorker(event)) {
+        sessionIdEvents.push(event);
+    }
+}
+export async function finalize() {
+    if (handlerState !== 2 /* HandlerState.INITIALIZED */) {
+        throw new Error('Handler is not initialized');
+    }
+    for (const sessionIdEvent of sessionIdEvents) {
+        if (!sessionIdEvent.args.data) {
+            continue;
+        }
+        workerIdByThread.set(sessionIdEvent.args.data.workerThreadId, sessionIdEvent.args.data.workerId);
+        workerURLById.set(sessionIdEvent.args.data.workerId, sessionIdEvent.args.data.url);
+    }
+    handlerState = 3 /* HandlerState.FINALIZED */;
+}
+export function data() {
+    if (handlerState !== 3 /* HandlerState.FINALIZED */) {
+        throw new Error('Workers Handler is not finalized');
+    }
+    return {
+        workerSessionIdEvents: [...sessionIdEvents],
+        workerIdByThread: new Map(workerIdByThread),
+        workerURLById: new Map(workerURLById),
+    };
+}
+//# sourceMappingURL=WorkersHandler.js.map

package/models/trace/handlers/WorkersHandler.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"WorkersHandler.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/handlers/WorkersHandler.ts"],"names":[],"mappings":"AAAA,4DAA4D;AAC5D,yEAAyE;AACzE,6BAA6B;AAE7B,OAAO,KAAK,KAAK,MAAM,mBAAmB,CAAC;AAS3C,IAAI,YAAY,qCAA6B,CAAC;AAE9C,MAAM,eAAe,GAA4D,EAAE,CAAC;AACpF,MAAM,gBAAgB,GAAgE,IAAI,GAAG,EAAE,CAAC;AAChG,MAAM,aAAa,GAA4C,IAAI,GAAG,EAAE,CAAC;AAEzE,MAAM,UAAU,UAAU;IACxB,IAAI,YAAY,uCAA+B,EAAE;QAC/C,MAAM,IAAI,KAAK,CAAC,+BAA+B,CAAC,CAAC;KAClD;IAED,YAAY,mCAA2B,CAAC;AAC1C,CAAC;AAED,MAAM,UAAU,KAAK;IACnB,eAAe,CAAC,MAAM,GAAG,CAAC,CAAC;IAC3B,gBAAgB,CAAC,KAAK,EAAE,CAAC;IACzB,aAAa,CAAC,KAAK,EAAE,CAAC;IACtB,YAAY,qCAA6B,CAAC;AAC5C,CAAC;AAED,MAAM,UAAU,WAAW,CAAC,KAAuC;IACjE,IAAI,YAAY,qCAA6B,EAAE;QAC7C,MAAM,IAAI,KAAK,CAAC,oCAAoC,CAAC,CAAC;KACvD;IACD,IAAI,KAAK,CAAC,WAAW,CAAC,qCAAqC,CAAC,KAAK,CAAC,EAAE;QAClE,eAAe,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;KAC7B;AACH,CAAC;AAED,MAAM,CAAC,KAAK,UAAU,QAAQ;IAC5B,IAAI,YAAY,qCAA6B,EAAE;QAC7C,MAAM,IAAI,KAAK,CAAC,4BAA4B,CAAC,CAAC;KAC/C;IACD,KAAK,MAAM,cAAc,IAAI,eAAe,EAAE;QAC5C,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,EAAE;YAC7B,SAAS;SACV;QACD,gBAAgB,CAAC,GAAG,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;QACjG,aAAa,CAAC,GAAG,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;KACpF;IACD,YAAY,iCAAyB,CAAC;AACxC,CAAC;AAED,MAAM,UAAU,IAAI;IAClB,IAAI,YAAY,mCAA2B,EAAE;QAC3C,MAAM,IAAI,KAAK,CAAC,kCAAkC,CAAC,CAAC;KACrD;IAED,OAAO;QACL,qBAAqB,EAAE,CAAC,GAAG,eAAe,CAAC;QAC3C,gBAAgB,EAAE,IAAI,GAAG,CAAC,gBAAgB,CAAC;QAC3C,aAAa,EAAE,IAAI,GAAG,CAAC,aAAa,CAAC;KACtC,CAAC;AACJ,CAAC","sourcesContent":["// Copyright 2023 The Chromium Authors. All rights reserved.\n// Use of this source code is governed by a BSD-style license that can be\n// found in the LICENSE file.\n\nimport * as Types from '../types/types.js';\n\nimport {HandlerState} from './types.js';\n\nexport interface WorkersData {\n  workerSessionIdEvents: readonly Types.TraceEvents.TraceEventTracingSessionIdForWorker[];\n  workerIdByThread: Map<Types.TraceEvents.ThreadID, Types.TraceEvents.WorkerId>;\n  workerURLById: Map<Types.TraceEvents.WorkerId, string>;\n}\nlet handlerState = HandlerState.UNINITIALIZED;\n\nconst sessionIdEvents: Types.TraceEvents.TraceEventTracingSessionIdForWorker[] = [];\nconst workerIdByThread: Map<Types.TraceEvents.ThreadID, Types.TraceEvents.WorkerId> = new Map();\nconst workerURLById: Map<Types.TraceEvents.WorkerId, string> = new Map();\n\nexport function initialize(): void {\n  if (handlerState !== HandlerState.UNINITIALIZED) {\n    throw new Error('Workers Handler was not reset');\n  }\n\n  handlerState = HandlerState.INITIALIZED;\n}\n\nexport function reset(): void {\n  sessionIdEvents.length = 0;\n  workerIdByThread.clear();\n  workerURLById.clear();\n  handlerState = HandlerState.UNINITIALIZED;\n}\n\nexport function handleEvent(event: Types.TraceEvents.TraceEventData): void {\n  if (handlerState !== HandlerState.INITIALIZED) {\n    throw new Error('Workers Handler is not initialized');\n  }\n  if (Types.TraceEvents.isTraceEventTracingSessionIdForWorker(event)) {\n    sessionIdEvents.push(event);\n  }\n}\n\nexport async function finalize(): Promise<void> {\n  if (handlerState !== HandlerState.INITIALIZED) {\n    throw new Error('Handler is not initialized');\n  }\n  for (const sessionIdEvent of sessionIdEvents) {\n    if (!sessionIdEvent.args.data) {\n      continue;\n    }\n    workerIdByThread.set(sessionIdEvent.args.data.workerThreadId, sessionIdEvent.args.data.workerId);\n    workerURLById.set(sessionIdEvent.args.data.workerId, sessionIdEvent.args.data.url);\n  }\n  handlerState = HandlerState.FINALIZED;\n}\n\nexport function data(): WorkersData {\n  if (handlerState !== HandlerState.FINALIZED) {\n    throw new Error('Workers Handler is not finalized');\n  }\n\n  return {\n    workerSessionIdEvents: [...sessionIdEvents],\n    workerIdByThread: new Map(workerIdByThread),\n    workerURLById: new Map(workerURLById),\n  };\n}\n"]}

package/models/trace/handlers/bundle-tsconfig.json

@@ -0,0 +1 @@
+{"compilerOptions":{"composite":true,"outDir":".","baseUrl":".","rootDir":"../../../../../../../front_end/models/trace/handlers"},"files":["../../../../../../../front_end/models/trace/handlers/handlers.ts"],"references":[{"path":"./handlers-tsconfig.json"}]}

package/models/trace/handlers/devtools_entrypoint-bundle-typescript-tsconfig.json

@@ -0,0 +1,44 @@
+{
+  "compilerOptions": {
+    "allowJs": true,
+    "checkJs": true,
+    "composite": true,
+    "declaration": true,
+    "experimentalDecorators": true,
+    "forceConsistentCasingInFileNames": true,
+    "inlineSources": true,
+    "lib": [
+      "esnext",
+      "dom",
+      "dom.iterable"
+    ],
+    "module": "esnext",
+    "noEmitOnError": true,
+    "noFallthroughCasesInSwitch": true,
+    "noImplicitOverride": true,
+    "noImplicitReturns": true,
+    "noUnusedLocals": false,
+    "outDir": ".",
+    "rootDir": "../../../../../../../front_end/models/trace/handlers",
+    "skipLibCheck": true,
+    "sourceMap": true,
+    "strict": true,
+    "target": "esnext",
+    "tsBuildInfoFile": "devtools_entrypoint-bundle-typescript-tsconfig.json.tsbuildinfo",
+    "typeRoots": [],
+    "useUnknownInCatchVariables": false
+  },
+  "files": [
+    "../../../../../../../front_end/models/trace/handlers/handlers.ts",
+    "../../../../../../../front_end/legacy/legacy-defs.d.ts",
+    "../../../../../../../front_end/global_typings/global_defs.d.ts",
+    "../../../../../../../front_end/global_typings/request_idle_callback.d.ts",
+    "../../../../../../../node_modules/@types/filesystem/index.d.ts",
+    "../../../../../../../node_modules/@webgpu/types/dist/index.d.ts"
+  ],
+  "references": [
+    {
+      "path": "./handlers-tsconfig.json"
+    }
+  ]
+}

package/models/trace/handlers/handlers-tsconfig.json

@@ -0,0 +1,79 @@
+{
+  "compilerOptions": {
+    "allowJs": true,
+    "checkJs": true,
+    "composite": true,
+    "declaration": true,
+    "experimentalDecorators": true,
+    "forceConsistentCasingInFileNames": true,
+    "inlineSources": true,
+    "lib": [
+      "esnext",
+      "dom",
+      "dom.iterable"
+    ],
+    "module": "esnext",
+    "noEmitOnError": true,
+    "noFallthroughCasesInSwitch": true,
+    "noImplicitOverride": true,
+    "noImplicitReturns": true,
+    "noUnusedLocals": false,
+    "outDir": ".",
+    "rootDir": "../../../../../../../front_end/models/trace/handlers",
+    "skipLibCheck": true,
+    "sourceMap": true,
+    "strict": true,
+    "target": "esnext",
+    "tsBuildInfoFile": "handlers-tsconfig.json.tsbuildinfo",
+    "typeRoots": [],
+    "useUnknownInCatchVariables": false
+  },
+  "files": [
+    "../../../../../../../front_end/models/trace/handlers/AnimationHandler.ts",
+    "../../../../../../../front_end/models/trace/handlers/AuctionWorkletsHandler.ts",
+    "../../../../../../../front_end/models/trace/handlers/FramesHandler.ts",
+    "../../../../../../../front_end/models/trace/handlers/GPUHandler.ts",
+    "../../../../../../../front_end/models/trace/handlers/InitiatorsHandler.ts",
+    "../../../../../../../front_end/models/trace/handlers/InvalidationsHandler.ts",
+    "../../../../../../../front_end/models/trace/handlers/LargestImagePaintHandler.ts",
+    "../../../../../../../front_end/models/trace/handlers/LargestTextPaintHandler.ts",
+    "../../../../../../../front_end/models/trace/handlers/LayerTreeHandler.ts",
+    "../../../../../../../front_end/models/trace/handlers/LayoutShiftsHandler.ts",
+    "../../../../../../../front_end/models/trace/handlers/MemoryHandler.ts",
+    "../../../../../../../front_end/models/trace/handlers/MetaHandler.ts",
+    "../../../../../../../front_end/models/trace/handlers/ModelHandlers.ts",
+    "../../../../../../../front_end/models/trace/handlers/NetworkRequestsHandler.ts",
+    "../../../../../../../front_end/models/trace/handlers/PageLoadMetricsHandler.ts",
+    "../../../../../../../front_end/models/trace/handlers/RendererHandler.ts",
+    "../../../../../../../front_end/models/trace/handlers/SamplesHandler.ts",
+    "../../../../../../../front_end/models/trace/handlers/ScreenshotsHandler.ts",
+    "../../../../../../../front_end/models/trace/handlers/Threads.ts",
+    "../../../../../../../front_end/models/trace/handlers/UserInteractionsHandler.ts",
+    "../../../../../../../front_end/models/trace/handlers/UserTimingsHandler.ts",
+    "../../../../../../../front_end/models/trace/handlers/WarningsHandler.ts",
+    "../../../../../../../front_end/models/trace/handlers/WorkersHandler.ts",
+    "../../../../../../../front_end/models/trace/handlers/types.ts",
+    "../../../../../../../front_end/legacy/legacy-defs.d.ts",
+    "../../../../../../../front_end/global_typings/global_defs.d.ts",
+    "../../../../../../../front_end/global_typings/request_idle_callback.d.ts",
+    "../../../../../../../node_modules/@types/filesystem/index.d.ts",
+    "../../../../../../../node_modules/@webgpu/types/dist/index.d.ts"
+  ],
+  "references": [
+    {
+      "path": "../../../core/platform/bundle-tsconfig.json"
+    },
+    {
+      "path": "../../../generated/generated-tsconfig.json"
+    },
+    {
+      "path": "../../cpu_profile/bundle-tsconfig.json"
+    },
+    {
+      "path": "../helpers/bundle-tsconfig.json"
+    },
+    {
+      "path": "../types/bundle-tsconfig.json"
+    }
+  ]
+}

package/models/trace/handlers/handlers.d.ts

@@ -0,0 +1,3 @@
+export * as ModelHandlers from './ModelHandlers.js';
+export * as Threads from './Threads.js';
+export * as Types from './types.js';

package/models/trace/handlers/handlers.js

@@ -0,0 +1,7 @@
+// Copyright 2022 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.
+export * as ModelHandlers from './ModelHandlers.js';
+export * as Threads from './Threads.js';
+export * as Types from './types.js';
+//# sourceMappingURL=handlers.js.map

package/models/trace/handlers/handlers.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"handlers.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/handlers/handlers.ts"],"names":[],"mappings":"AAAA,4DAA4D;AAC5D,yEAAyE;AACzE,6BAA6B;AAE7B,OAAO,KAAK,aAAa,MAAM,oBAAoB,CAAC;AACpD,OAAO,KAAK,OAAO,MAAM,cAAc,CAAC;AACxC,OAAO,KAAK,KAAK,MAAM,YAAY,CAAC","sourcesContent":["// Copyright 2022 The Chromium Authors. All rights reserved.\n// Use of this source code is governed by a BSD-style license that can be\n// found in the LICENSE file.\n\nexport * as ModelHandlers from './ModelHandlers.js';\nexport * as Threads from './Threads.js';\nexport * as Types from './types.js';\n"]}

package/models/trace/handlers/types.d.ts

@@ -0,0 +1,45 @@
+import type * as Types from './../types/types.js';
+import * as ModelHandlers from './ModelHandlers.js';
+export interface TraceEventHandler {
+    reset(): void;
+    initialize?(freshRecording?: boolean): void;
+    handleEvent(data: {}): void;
+    finalize?(): Promise<void>;
+    data(): unknown;
+    deps?(): TraceEventHandlerName[];
+    handleUserConfig?(config: Types.Configuration.Configuration): void;
+}
+export type TraceEventHandlerName = keyof typeof ModelHandlers;
+export type EnabledHandlerDataWithMeta<T extends {
+    [key: string]: TraceEventHandler;
+}> = {
+    Meta: Readonly<ReturnType<typeof ModelHandlers['Meta']['data']>>;
+} & {
+    [K in keyof T]: Readonly<ReturnType<T[K]['data']>>;
+};
+export type HandlersWithMeta<T extends {
+    [key: string]: TraceEventHandler;
+}> = {
+    Meta: typeof ModelHandlers.Meta;
+} & {
+    [K in keyof T]: T[K];
+};
+export type TraceParseData = Readonly<EnabledHandlerDataWithMeta<typeof ModelHandlers>>;
+/**
+ * Because you can run the trace engine with a subset of handlers enabled,
+ * there can be times when you need to confirm if the trace contains all
+ * handlers or not, because some parts of the engine expect to be given all
+ * the handlers.
+ */
+export declare function handlerDataHasAllHandlers(data: Readonly<EnabledHandlerDataWithMeta<{}>>): data is TraceParseData;
+type DeepWriteable<T> = {
+    -readonly [P in keyof T]: DeepWriteable<T[P]>;
+};
+export type TraceParseDataMutable = DeepWriteable<TraceParseData>;
+export type Handlers = typeof ModelHandlers;
+export declare const enum HandlerState {
+    UNINITIALIZED = 1,
+    INITIALIZED = 2,
+    FINALIZED = 3
+}
+export {};

package/models/trace/handlers/types.js

@@ -0,0 +1,18 @@
+import * as ModelHandlers from './ModelHandlers.js';
+/**
+ * Because you can run the trace engine with a subset of handlers enabled,
+ * there can be times when you need to confirm if the trace contains all
+ * handlers or not, because some parts of the engine expect to be given all
+ * the handlers.
+ */
+export function handlerDataHasAllHandlers(data) {
+    let isMissingHandler = false;
+    for (const handlerName of Object.keys(ModelHandlers)) {
+        if (handlerName in data === false) {
+            isMissingHandler = true;
+            break;
+        }
+    }
+    return !isMissingHandler;
+}
+//# sourceMappingURL=types.js.map

package/models/trace/handlers/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/handlers/types.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,aAAa,MAAM,oBAAoB,CAAC;AA0DpD;;;;;GAKG;AACH,MAAM,UAAU,yBAAyB,CAAC,IAA8C;IACtF,IAAI,gBAAgB,GAAG,KAAK,CAAC;IAC7B,KAAK,MAAM,WAAW,IAAI,MAAM,CAAC,IAAI,CAAC,aAAa,CAAC,EAAE;QACpD,IAAI,WAAW,IAAI,IAAI,KAAK,KAAK,EAAE;YACjC,gBAAgB,GAAG,IAAI,CAAC;YACxB,MAAM;SACP;KACF;IACD,OAAO,CAAC,gBAAgB,CAAC;AAC3B,CAAC","sourcesContent":["\n// Copyright 2022 The Chromium Authors. All rights reserved.\n// Use of this source code is governed by a BSD-style license that can be\n// found in the LICENSE file.\nimport type * as Types from './../types/types.js';\nimport * as ModelHandlers from './ModelHandlers.js';\n\nexport interface TraceEventHandler {\n  reset(): void;\n  initialize?(freshRecording?: boolean): void;\n  handleEvent(data: {}): void;\n  finalize?(): Promise<void>;\n  data(): unknown;\n  deps?(): TraceEventHandlerName[];\n  handleUserConfig?(config: Types.Configuration.Configuration): void;\n}\nexport type TraceEventHandlerName = keyof typeof ModelHandlers;\n\n// This type maps TraceEventHandler names to the return type of their data\n// function. So, for example, if we are given an object with a key of 'foo'\n// and a value which is a TraceHandler containing a data() function that\n// returns a string, this type will be { foo: string }.\n//\n// This allows us to model the behavior of the TraceProcessor in the model,\n// which takes an object with TraceEventHandlers as part of its config, and\n// which ultimately returns an object keyed off the names of the\n// TraceEventHandlers, and with values that are derived from each\n// TraceEventHandler's data function.\n//\n// So, concretely, we provide a TraceEventHandler for calculating the #time\n// bounds of a trace called TraceBounds, whose data() function returns a\n// TraceWindow. The HandlerData, therefore, would determine that the\n// TraceProcessor would contain a key called 'TraceBounds' whose value is\n// a TraceWindow.\nexport type EnabledHandlerDataWithMeta<T extends {[key: string]: TraceEventHandler}> = {\n  // We allow the user to configure which handlers are created by passing them\n  // in when constructing a model instance. However, we then ensure that the\n  // Meta handler is added to that, as the Model relies on some of the data\n  // from the Meta handler when creating the file. Therefore, this type\n  // explicitly defines that the Meta data is present, before then extending it\n  // with the index type to represent all the other handlers.\n  // eslint-disable-next-line @typescript-eslint/naming-convention\n  Meta: Readonly<ReturnType<typeof ModelHandlers['Meta']['data']>>,\n}&{\n  // For every key in the object, look up the TraceEventHandler's data function\n  // and use its return type as the value for the object.\n  [K in keyof T]: Readonly<ReturnType<T[K]['data']>>;\n};\n\nexport type HandlersWithMeta<T extends {[key: string]: TraceEventHandler}> = {\n  // eslint-disable-next-line @typescript-eslint/naming-convention\n  Meta: typeof ModelHandlers.Meta,\n}&{\n  [K in keyof T]: T[K];\n};\n\n// Represents the final parsed data from all of the handlers. Note that because\n// we are currently in the middle of the migration of data engines, not all the\n// handlers are enabled. Therefore for now you should use the type defined in\n// models/trace/handlers/Migration.ts, `PartialTraceData`, which\n// represents the final parsed data for only the enabled handlers.\nexport type TraceParseData = Readonly<EnabledHandlerDataWithMeta<typeof ModelHandlers>>;\n\n/**\n * Because you can run the trace engine with a subset of handlers enabled,\n * there can be times when you need to confirm if the trace contains all\n * handlers or not, because some parts of the engine expect to be given all\n * the handlers.\n */\nexport function handlerDataHasAllHandlers(data: Readonly<EnabledHandlerDataWithMeta<{}>>): data is TraceParseData {\n  let isMissingHandler = false;\n  for (const handlerName of Object.keys(ModelHandlers)) {\n    if (handlerName in data === false) {\n      isMissingHandler = true;\n      break;\n    }\n  }\n  return !isMissingHandler;\n}\n\ntype DeepWriteable<T> = {\n  -readonly[P in keyof T]: DeepWriteable<T[P]>\n};\nexport type TraceParseDataMutable = DeepWriteable<TraceParseData>;\n\nexport type Handlers = typeof ModelHandlers;\n\nexport const enum HandlerState {\n  UNINITIALIZED = 1,\n  INITIALIZED = 2,\n  FINALIZED = 3,\n}\n"]}

package/models/trace/helpers/SamplesIntegrator.d.ts

@@ -0,0 +1,49 @@
+import type * as Protocol from '../../../generated/protocol.js';
+import type * as CPUProfile from '../../cpu_profile/cpu_profile.js';
+import * as Types from '../types/types.js';
+/**
+ * This is a helper that integrates CPU profiling data coming in the
+ * shape of samples, with trace events. Samples indicate what the JS
+ * stack trace looked at a given point in time, but they don't have
+ * duration. The SamplesIntegrator task is to make an approximation
+ * of what the duration of each JS call was, given the sample data and
+ * given the trace events profiled during that time. At the end of its
+ * execution, the SamplesIntegrator returns an array of ProfileCalls
+ * (under SamplesIntegrator::buildProfileCalls()), which
+ * represent JS calls, with a call frame and duration. These calls have
+ * the shape of a complete trace events and can be treated as flame
+ * chart entries in the timeline.
+ *
+ * The approach to build the profile calls consists in tracking the
+ * current stack as the following events happen (in order):
+ * 1. A sample was done.
+ * 2. A trace event started.
+ * 3. A trace event ended.
+ * Depending on the event and on the data that's coming with it the
+ * stack is updated by adding or removing JS calls to it and updating
+ * the duration of the calls in the tracking stack.
+ *
+ * note: Although this approach has been implemented since long ago, and
+ * is relatively efficent (adds a complexity over the trace parsing of
+ * O(n) where n is the number of samples) it has proven to be faulty.
+ * It might be worthwhile experimenting with improvements or with a
+ * completely different approach. Improving the approach is tracked in
+ * crbug.com/1417439
+ */
+export declare class SamplesIntegrator {
+    #private;
+    constructor(profileModel: CPUProfile.CPUProfileDataModel.CPUProfileDataModel, pid: Types.TraceEvents.ProcessID, tid: Types.TraceEvents.ThreadID, configuration?: Types.Configuration.Configuration);
+    buildProfileCalls(traceEvents: Types.TraceEvents.TraceEventData[]): Types.TraceEvents.SyntheticProfileCall[];
+    /**
+     * Builds the initial calls with no duration from samples. Their
+     * purpose is to be merged with the trace event array being parsed so
+     * that they can be traversed in order with them and their duration
+     * can be updated as the SampleIntegrator callbacks are invoked.
+     */
+    callsFromProfileSamples(): Types.TraceEvents.SyntheticProfileCall[];
+    static framesAreEqual(frame1: Protocol.Runtime.CallFrame, frame2: Protocol.Runtime.CallFrame): boolean;
+    static showNativeName(name: string, runtimeCallStatsEnabled: boolean): boolean;
+    static nativeGroup(nativeName: string): 'Parse' | 'Compile' | null;
+    static isNativeRuntimeFrame(frame: Protocol.Runtime.CallFrame): boolean;
+    static filterStackFrames(stack: Types.TraceEvents.SyntheticProfileCall[], engineConfig: Types.Configuration.Configuration): void;
+}