@paulirish/trace_engine 0.0.36 → 0.0.37
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.tmp/tsbuildinfo/tsconfig.tsbuildinfo +1 -1
- package/generated/protocol.d.ts +21 -3
- package/models/trace/Processor.d.ts +1 -1
- package/models/trace/Processor.js +4 -4
- package/models/trace/Processor.js.map +1 -1
- package/models/trace/extras/TimelineJSProfile.d.ts +13 -0
- package/models/trace/extras/TimelineJSProfile.js +55 -0
- package/models/trace/extras/TimelineJSProfile.js.map +1 -0
- package/models/trace/extras/TraceFilter.d.ts +21 -0
- package/models/trace/extras/TraceFilter.js +51 -0
- package/models/trace/extras/TraceFilter.js.map +1 -0
- package/models/trace/extras/TraceTree.d.ts +91 -0
- package/models/trace/extras/TraceTree.js +515 -0
- package/models/trace/extras/TraceTree.js.map +1 -0
- package/models/trace/extras/extras-tsconfig.json +3 -0
- package/models/trace/extras/extras.js.map +1 -1
- package/models/trace/handlers/LargestImagePaintHandler.d.ts +7 -1
- package/models/trace/handlers/LargestImagePaintHandler.js +43 -1
- package/models/trace/handlers/LargestImagePaintHandler.js.map +1 -1
- package/models/trace/handlers/MetaHandler.js +2 -3
- package/models/trace/handlers/MetaHandler.js.map +1 -1
- package/models/trace/handlers/NetworkRequestsHandler.js +2 -0
- package/models/trace/handlers/NetworkRequestsHandler.js.map +1 -1
- package/models/trace/insights/CLSCulprits.d.ts +57 -0
- package/models/trace/insights/CLSCulprits.js +335 -0
- package/models/trace/insights/CLSCulprits.js.map +1 -0
- package/models/trace/insights/Common.d.ts +2 -10
- package/models/trace/insights/Common.js +1 -36
- package/models/trace/insights/Common.js.map +1 -1
- package/models/trace/insights/DocumentLatency.d.ts +3 -3
- package/models/trace/insights/DocumentLatency.js.map +1 -1
- package/models/trace/insights/FontDisplay.d.ts +3 -3
- package/models/trace/insights/FontDisplay.js.map +1 -1
- package/models/trace/insights/InteractionToNextPaint.d.ts +3 -3
- package/models/trace/insights/InteractionToNextPaint.js.map +1 -1
- package/models/trace/insights/LCPDiscovery.d.ts +13 -0
- package/models/trace/insights/LCPDiscovery.js +60 -0
- package/models/trace/insights/LCPDiscovery.js.map +1 -0
- package/models/trace/insights/LCPPhases.d.ts +34 -0
- package/models/trace/insights/LCPPhases.js +97 -0
- package/models/trace/insights/LCPPhases.js.map +1 -0
- package/models/trace/insights/Models.d.ts +10 -0
- package/models/trace/insights/Models.js +14 -0
- package/models/trace/insights/Models.js.map +1 -0
- package/models/trace/insights/RenderBlocking.d.ts +4 -4
- package/models/trace/insights/RenderBlocking.js +1 -16
- package/models/trace/insights/RenderBlocking.js.map +1 -1
- package/models/trace/insights/SlowCSSSelector.d.ts +3 -3
- package/models/trace/insights/SlowCSSSelector.js.map +1 -1
- package/models/trace/insights/ThirdParties.d.ts +13 -0
- package/models/trace/insights/ThirdParties.js +42 -0
- package/models/trace/insights/ThirdParties.js.map +1 -0
- package/models/trace/insights/Viewport.d.ts +3 -3
- package/models/trace/insights/Viewport.js.map +1 -1
- package/models/trace/insights/insights-tsconfig.json +5 -4
- package/models/trace/insights/insights.d.ts +1 -1
- package/models/trace/insights/insights.js +1 -1
- package/models/trace/insights/insights.js.map +1 -1
- package/models/trace/insights/types.d.ts +9 -9
- package/models/trace/insights/types.js.map +1 -1
- package/models/trace/trace-tsconfig.json +6 -0
- package/models/trace/types/TraceEvents.d.ts +22 -5
- package/models/trace/types/TraceEvents.js +5 -3
- package/models/trace/types/TraceEvents.js.map +1 -1
- package/package.json +1 -1
- package/test/test-trace-engine.mjs +12 -16
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import type * as Handlers from '../handlers/handlers.js';
|
|
2
2
|
import type * as Lantern from '../lantern/lantern.js';
|
|
3
3
|
import type * as Types from '../types/types.js';
|
|
4
|
-
import type * as
|
|
4
|
+
import type * as Models from './Models.js';
|
|
5
5
|
/**
|
|
6
6
|
* Context for the portion of the trace an insight should look at.
|
|
7
7
|
*/
|
|
@@ -23,7 +23,7 @@ export interface LanternContext {
|
|
|
23
23
|
simulator: Lantern.Simulation.Simulator<Types.Events.SyntheticNetworkRequest>;
|
|
24
24
|
metrics: Record<string, Lantern.Metrics.MetricResult>;
|
|
25
25
|
}
|
|
26
|
-
export type
|
|
26
|
+
export type InsightModelsType = typeof Models;
|
|
27
27
|
export declare enum InsightWarning {
|
|
28
28
|
NO_FP = "NO_FP",
|
|
29
29
|
NO_LCP = "NO_LCP",
|
|
@@ -37,7 +37,7 @@ export interface MetricSavings {
|
|
|
37
37
|
CLS?: number;
|
|
38
38
|
INP?: Types.Timing.MilliSeconds;
|
|
39
39
|
}
|
|
40
|
-
export type
|
|
40
|
+
export type InsightModel<R extends Record<string, unknown>> = R & {
|
|
41
41
|
relatedEvents?: Types.Events.Event[];
|
|
42
42
|
warnings?: InsightWarning[];
|
|
43
43
|
metricSavings?: MetricSavings;
|
|
@@ -47,21 +47,21 @@ export type InsightResult<R extends Record<string, unknown>> = R & {
|
|
|
47
47
|
* this could instead represent the duration from the beginning of the trace up to the first recorded
|
|
48
48
|
* navigation (or the end of the trace).
|
|
49
49
|
*/
|
|
50
|
-
export type
|
|
50
|
+
export type InsightSet = {
|
|
51
51
|
/** If for a navigation, this is the navigationId. Else it is Trace.Types.Events.NO_NAVIGATION. */
|
|
52
52
|
id: Types.Events.NavigationId;
|
|
53
53
|
/** The URL to show in the accordion list. */
|
|
54
54
|
url: URL;
|
|
55
55
|
frameId: string;
|
|
56
56
|
bounds: Types.Timing.TraceWindowMicroSeconds;
|
|
57
|
-
|
|
57
|
+
model: InsightModels;
|
|
58
58
|
navigation?: Types.Events.NavigationStart;
|
|
59
59
|
};
|
|
60
60
|
/**
|
|
61
|
-
* Contains insights for a specific
|
|
61
|
+
* Contains insights for a specific insight set.
|
|
62
62
|
*/
|
|
63
|
-
export type
|
|
64
|
-
[I in keyof
|
|
63
|
+
export type InsightModels = {
|
|
64
|
+
[I in keyof InsightModelsType]: ReturnType<InsightModelsType[I]['generateInsight']>;
|
|
65
65
|
};
|
|
66
66
|
/**
|
|
67
67
|
* Contains insights for the entire trace. Insights are mostly grouped by `navigationId`, with one exception:
|
|
@@ -69,7 +69,7 @@ export type InsightResults = {
|
|
|
69
69
|
* If the analyzed trace started after the navigation, and has meaningful work with that span, there is no
|
|
70
70
|
* navigation to map it to. In this case `Types.Events.NO_NAVIGATION` is used for the key.
|
|
71
71
|
*/
|
|
72
|
-
export type TraceInsightSets = Map<Types.Events.NavigationId,
|
|
72
|
+
export type TraceInsightSets = Map<Types.Events.NavigationId, InsightSet>;
|
|
73
73
|
/**
|
|
74
74
|
* Represents the narrow set of dependencies defined by an insight's `deps()` function. `Meta` is always included regardless of `deps()`.
|
|
75
75
|
*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/insights/types.ts"],"names":[],"mappings":"AAAA,4DAA4D;AAC5D,yEAAyE;AACzE,6BAA6B;AAmC7B,MAAM,CAAN,IAAY,cAMX;AAND,WAAY,cAAc;IACxB,iCAAe,CAAA;IACf,mCAAiB,CAAA;IACjB,uEAAuE;IACvE,6DAA2C,CAAA;IAC3C,yCAAuB,CAAA;AACzB,CAAC,EANW,cAAc,KAAd,cAAc,QAMzB","sourcesContent":["// Copyright 2024 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 type * as Handlers from '../handlers/handlers.js';\nimport type * as Lantern from '../lantern/lantern.js';\nimport type * as Types from '../types/types.js';\n\nimport type * as
|
|
1
|
+
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/insights/types.ts"],"names":[],"mappings":"AAAA,4DAA4D;AAC5D,yEAAyE;AACzE,6BAA6B;AAmC7B,MAAM,CAAN,IAAY,cAMX;AAND,WAAY,cAAc;IACxB,iCAAe,CAAA;IACf,mCAAiB,CAAA;IACjB,uEAAuE;IACvE,6DAA2C,CAAA;IAC3C,yCAAuB,CAAA;AACzB,CAAC,EANW,cAAc,KAAd,cAAc,QAMzB","sourcesContent":["// Copyright 2024 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 type * as Handlers from '../handlers/handlers.js';\nimport type * as Lantern from '../lantern/lantern.js';\nimport type * as Types from '../types/types.js';\n\nimport type * as Models from './Models.js';\n\n/**\n * Context for the portion of the trace an insight should look at.\n */\nexport type InsightSetContext = InsightSetContextWithoutNavigation|InsightSetContextWithNavigation;\n\nexport interface InsightSetContextWithoutNavigation {\n bounds: Types.Timing.TraceWindowMicroSeconds;\n frameId: string;\n navigation?: never;\n}\n\nexport interface InsightSetContextWithNavigation {\n bounds: Types.Timing.TraceWindowMicroSeconds;\n frameId: string;\n navigation: Types.Events.NavigationStart;\n navigationId: string;\n lantern?: LanternContext;\n}\n\nexport interface LanternContext {\n graph: Lantern.Graph.Node<Types.Events.SyntheticNetworkRequest>;\n simulator: Lantern.Simulation.Simulator<Types.Events.SyntheticNetworkRequest>;\n metrics: Record<string, Lantern.Metrics.MetricResult>;\n}\n\nexport type InsightModelsType = typeof Models;\n\nexport enum InsightWarning {\n NO_FP = 'NO_FP',\n NO_LCP = 'NO_LCP',\n // No network request could be identified as the primary HTML document.\n NO_DOCUMENT_REQUEST = 'NO_DOCUMENT_REQUEST',\n NO_LAYOUT = 'NO_LAYOUT',\n}\n\nexport interface MetricSavings {\n /* eslint-disable @typescript-eslint/naming-convention */\n FCP?: Types.Timing.MilliSeconds;\n LCP?: Types.Timing.MilliSeconds;\n TBT?: Types.Timing.MilliSeconds;\n CLS?: number;\n INP?: Types.Timing.MilliSeconds;\n /* eslint-enable @typescript-eslint/naming-convention */\n}\n\nexport type InsightModel<R extends Record<string, unknown>> = R&{\n relatedEvents?: Types.Events.Event[],\n warnings?: InsightWarning[],\n metricSavings?: MetricSavings,\n};\n\n/**\n * Contains insights for a specific navigation. If a trace began after a navigation already started,\n * this could instead represent the duration from the beginning of the trace up to the first recorded\n * navigation (or the end of the trace).\n */\nexport type InsightSet = {\n /** If for a navigation, this is the navigationId. Else it is Trace.Types.Events.NO_NAVIGATION. */\n id: Types.Events.NavigationId,\n /** The URL to show in the accordion list. */\n url: URL,\n frameId: string,\n bounds: Types.Timing.TraceWindowMicroSeconds,\n model: InsightModels,\n navigation?: Types.Events.NavigationStart,\n};\n\n/**\n * Contains insights for a specific insight set.\n */\nexport type InsightModels = {\n [I in keyof InsightModelsType]: ReturnType<InsightModelsType[I]['generateInsight']>;\n};\n\n/**\n * Contains insights for the entire trace. Insights are mostly grouped by `navigationId`, with one exception:\n *\n * If the analyzed trace started after the navigation, and has meaningful work with that span, there is no\n * navigation to map it to. In this case `Types.Events.NO_NAVIGATION` is used for the key.\n */\nexport type TraceInsightSets = Map<Types.Events.NavigationId, InsightSet>;\n\n/**\n * Represents the narrow set of dependencies defined by an insight's `deps()` function. `Meta` is always included regardless of `deps()`.\n */\nexport type RequiredData<D extends() => Array<keyof typeof Handlers.ModelHandlers>> =\n Handlers.Types.EnabledHandlerDataWithMeta<Pick<typeof Handlers.ModelHandlers, ReturnType<D>[number]>>;\n"]}
|
|
@@ -26,6 +26,9 @@ export declare const enum Phase {
|
|
|
26
26
|
MARK = "R",
|
|
27
27
|
CLOCK_SYNC = "c"
|
|
28
28
|
}
|
|
29
|
+
export type NonEmptyString = string & {
|
|
30
|
+
_tag: 'NonEmptyString';
|
|
31
|
+
};
|
|
29
32
|
export declare function isNestableAsyncPhase(phase: Phase): boolean;
|
|
30
33
|
export declare function isPhaseAsync(phase: Phase): boolean;
|
|
31
34
|
export declare function isFlowPhase(phase: Phase): boolean;
|
|
@@ -452,11 +455,12 @@ export interface ProcessName extends Metadata {
|
|
|
452
455
|
export interface Mark extends Event {
|
|
453
456
|
ph: Phase.MARK;
|
|
454
457
|
}
|
|
455
|
-
export interface
|
|
458
|
+
export interface NavigationStartUnreliable extends Mark {
|
|
456
459
|
name: 'navigationStart';
|
|
457
460
|
args: Args & {
|
|
458
461
|
data?: ArgsData & {
|
|
459
|
-
documentLoaderURL
|
|
462
|
+
/** An empty documentLoaderURL means this navigationStart is unreliable noise and can be ignored. */
|
|
463
|
+
documentLoaderURL: never;
|
|
460
464
|
isLoadingMainFrame: boolean;
|
|
461
465
|
isOutermostMainFrame?: boolean;
|
|
462
466
|
navigationId: string;
|
|
@@ -468,6 +472,14 @@ export interface NavigationStart extends Mark {
|
|
|
468
472
|
frame: string;
|
|
469
473
|
};
|
|
470
474
|
}
|
|
475
|
+
export interface NavigationStart extends NavigationStartUnreliable {
|
|
476
|
+
args: NavigationStartUnreliable['args'] & {
|
|
477
|
+
data: NavigationStartUnreliable['args']['data'] & {
|
|
478
|
+
/** This navigationStart is valid, as the documentLoaderURL isn't empty. */
|
|
479
|
+
documentLoaderURL: NonEmptyString;
|
|
480
|
+
};
|
|
481
|
+
};
|
|
482
|
+
}
|
|
471
483
|
export interface FirstContentfulPaint extends Mark {
|
|
472
484
|
name: Name.MARK_FCP;
|
|
473
485
|
args: Args & {
|
|
@@ -752,8 +764,9 @@ export interface ResourceChangePriority extends Instant {
|
|
|
752
764
|
};
|
|
753
765
|
};
|
|
754
766
|
}
|
|
767
|
+
/** Only sent for navigations. https://source.chromium.org/chromium/chromium/src/+/main:content/browser/devtools/devtools_instrumentation.cc;l=1612-1647;drc=ec7daf93d0479b758610c75f4e146fd4d2d6ed2b */
|
|
755
768
|
export interface ResourceWillSendRequest extends Instant {
|
|
756
|
-
name:
|
|
769
|
+
name: Name.RESOURCE_WILL_SEND_REQUEST;
|
|
757
770
|
args: Args & {
|
|
758
771
|
data: ArgsData & {
|
|
759
772
|
requestId: string;
|
|
@@ -782,6 +795,7 @@ export interface ResourceReceivedData extends Instant {
|
|
|
782
795
|
};
|
|
783
796
|
};
|
|
784
797
|
}
|
|
798
|
+
/** See https://mdn.github.io/shared-assets/images/diagrams/api/performance/timestamp-diagram.svg */
|
|
785
799
|
interface ResourceReceiveResponseTimingData {
|
|
786
800
|
connectEnd: MilliSeconds;
|
|
787
801
|
connectStart: MilliSeconds;
|
|
@@ -793,6 +807,7 @@ interface ResourceReceiveResponseTimingData {
|
|
|
793
807
|
pushStart: MilliSeconds;
|
|
794
808
|
receiveHeadersEnd: MilliSeconds;
|
|
795
809
|
receiveHeadersStart: MilliSeconds;
|
|
810
|
+
/** When the network service is about to handle a request, ie. just before going to the HTTP cache or going to the network for DNS/connection setup. */
|
|
796
811
|
requestTime: Seconds;
|
|
797
812
|
sendEnd: MilliSeconds;
|
|
798
813
|
sendStart: MilliSeconds;
|
|
@@ -1448,7 +1463,8 @@ export declare function isProcessName(event: Event): event is ProcessName;
|
|
|
1448
1463
|
export declare function isTracingStartedInBrowser(event: Event): event is TracingStartedInBrowser;
|
|
1449
1464
|
export declare function isFrameCommittedInBrowser(event: Event): event is FrameCommittedInBrowser;
|
|
1450
1465
|
export declare function isCommitLoad(event: Event): event is CommitLoad;
|
|
1451
|
-
|
|
1466
|
+
/** @deprecated You probably want `isNavigationStart` instead. */
|
|
1467
|
+
export declare function isNavigationStartUnreliable(event: Event): event is NavigationStartUnreliable;
|
|
1452
1468
|
export declare function isAnimation(event: Event): event is Animation;
|
|
1453
1469
|
export declare function isSyntheticAnimation(event: Event): event is SyntheticAnimationPair;
|
|
1454
1470
|
export declare function isLayoutShift(event: Event): event is LayoutShift;
|
|
@@ -1479,7 +1495,8 @@ export declare function isSyntheticNetworkRequest(event: Event): event is Synthe
|
|
|
1479
1495
|
export declare function isSyntheticWebSocketConnection(event: Event): event is SyntheticWebSocketConnection;
|
|
1480
1496
|
export declare function isNetworkTrackEntry(event: Event): event is SyntheticWebSocketConnection | SyntheticNetworkRequest;
|
|
1481
1497
|
export declare function isPrePaint(event: Event): event is PrePaint;
|
|
1482
|
-
|
|
1498
|
+
/** A VALID navigation start (as it has a populated documentLoaderURL) */
|
|
1499
|
+
export declare function isNavigationStart(event: Event): event is NavigationStart;
|
|
1483
1500
|
export declare function isMainFrameViewport(event: Event): event is MainFrameViewport;
|
|
1484
1501
|
export declare function isSyntheticUserTiming(event: Event): event is SyntheticUserTimingPair;
|
|
1485
1502
|
export declare function isSyntheticConsoleTiming(event: Event): event is SyntheticConsoleTimingPair;
|
|
@@ -246,7 +246,8 @@ export function isFrameCommittedInBrowser(event) {
|
|
|
246
246
|
export function isCommitLoad(event) {
|
|
247
247
|
return event.name === 'CommitLoad';
|
|
248
248
|
}
|
|
249
|
-
|
|
249
|
+
/** @deprecated You probably want `isNavigationStart` instead. */
|
|
250
|
+
export function isNavigationStartUnreliable(event) {
|
|
250
251
|
return event.name === 'navigationStart';
|
|
251
252
|
}
|
|
252
253
|
export function isAnimation(event) {
|
|
@@ -347,8 +348,9 @@ export function isNetworkTrackEntry(event) {
|
|
|
347
348
|
export function isPrePaint(event) {
|
|
348
349
|
return event.name === 'PrePaint';
|
|
349
350
|
}
|
|
350
|
-
|
|
351
|
-
|
|
351
|
+
/** A VALID navigation start (as it has a populated documentLoaderURL) */
|
|
352
|
+
export function isNavigationStart(event) {
|
|
353
|
+
return Boolean(isNavigationStartUnreliable(event) && event.args.data && event.args.data.documentLoaderURL !== '');
|
|
352
354
|
}
|
|
353
355
|
export function isMainFrameViewport(event) {
|
|
354
356
|
return event.name === 'PaintTimingVisualizer::Viewport';
|