diff --git a/front_end/core/host/RNPerfMetrics.ts b/front_end/core/host/RNPerfMetrics.ts index 1809af4c68a..2312139fc24 100644 --- a/front_end/core/host/RNPerfMetrics.ts +++ b/front_end/core/host/RNPerfMetrics.ts @@ -53,6 +53,17 @@ class RNPerfMetrics { } } + registerPerfMetricsGlobalPostMessageHandler(): void { + if (globalThis.enableReactNativePerfMetrics !== true || + globalThis.enableReactNativePerfMetricsGlobalPostMessage !== true) { + return; + } + + this.addEventListener(event => { + window.postMessage({event, tag: 'react-native-chrome-devtools-perf-metrics'}, window.location.origin); + }); + } + setLaunchId(launchId: string|null): void { this.#launchId = launchId; } @@ -80,17 +91,6 @@ function getPerfTimestamp(): DOMHighResTimeStamp { return performance.timeOrigin + performance.now(); } -export function registerPerfMetricsGlobalPostMessageHandler(): void { - if (globalThis.enableReactNativePerfMetrics !== true || - globalThis.enableReactNativePerfMetricsGlobalPostMessage !== true) { - return; - } - - getInstance().addEventListener(event => { - window.postMessage({event, tag: 'react-native-chrome-devtools-perf-metrics'}, window.location.origin); - }); -} - type CommonEventFields = Readonly<{ timestamp: DOMHighResTimeStamp, launchId: string | void | null, diff --git a/front_end/entrypoints/rn_fusebox/rn_fusebox.ts b/front_end/entrypoints/rn_fusebox/rn_fusebox.ts index 2e803aa3c17..6589cb55705 100644 --- a/front_end/entrypoints/rn_fusebox/rn_fusebox.ts +++ b/front_end/entrypoints/rn_fusebox/rn_fusebox.ts @@ -22,11 +22,18 @@ import * as SDK from '../../core/sdk/sdk.js'; import * as UI from '../../ui/legacy/legacy.js'; import * as Main from '../main/main.js'; -import type * as InspectorBackend from '../../core/protocol_client/InspectorBackend.js'; import type * as Platform from '../../core/platform/platform.js'; import type * as Sources from '../../panels/sources/sources.js'; import * as RNExperiments from '../../core/rn_experiments/rn_experiments.js'; +/* + * To ensure accurate timing measurements, + * please make sure these perf metrics lines are called ahead of everything else + */ +Host.rnPerfMetrics.registerPerfMetricsGlobalPostMessageHandler(); +Host.rnPerfMetrics.setLaunchId(Root.Runtime.Runtime.queryParam('launchId')); +Host.rnPerfMetrics.entryPointLoadingStarted('rn_fusebox'); + const UIStrings = { /** *@description Title of the 'React Native' tool in the Network Navigator View, which is part of the Sources tool @@ -67,11 +74,6 @@ RNExperiments.RNExperimentsImpl.Instance.enableExperimentsByDefault([ Root.Runtime.ExperimentName.REACT_NATIVE_SPECIFIC_UI, ]); -Host.RNPerfMetrics.registerPerfMetricsGlobalPostMessageHandler(); - -Host.rnPerfMetrics.setLaunchId(Root.Runtime.Runtime.queryParam('launchId')); -Host.rnPerfMetrics.entryPointLoadingStarted('rn_fusebox'); - class FuseboxClientMetadataModel extends SDK.SDKModel.SDKModel { constructor(target: SDK.Target.Target) { super(target); diff --git a/front_end/entrypoints/rn_inspector/rn_inspector.ts b/front_end/entrypoints/rn_inspector/rn_inspector.ts index 7df1a8a6c9e..6e71ac3aa59 100644 --- a/front_end/entrypoints/rn_inspector/rn_inspector.ts +++ b/front_end/entrypoints/rn_inspector/rn_inspector.ts @@ -23,8 +23,11 @@ import type * as Sources from '../../panels/sources/sources.js'; import * as RNExperiments from '../../core/rn_experiments/rn_experiments.js'; import * as Host from '../../core/host/host.js'; -Host.RNPerfMetrics.registerPerfMetricsGlobalPostMessageHandler(); - +/* + * To ensure accurate timing measurements, + * please make sure these perf metrics lines are called ahead of everything else + */ +Host.rnPerfMetrics.registerPerfMetricsGlobalPostMessageHandler(); Host.rnPerfMetrics.setLaunchId(Root.Runtime.Runtime.queryParam('launchId')); Host.rnPerfMetrics.entryPointLoadingStarted('rn_inspector');