@office-iss/react-native-win32 0.81.2 → 0.82.0-preview.2

package/src/private/webapis/performance/PerformanceEntry.js

@@ -28,50 +28,67 @@ export type PerformanceEntryJSON = {
   ...
 };
 
+export interface PerformanceEntryInit {
+  +name: string;
+  +startTime: DOMHighResTimeStamp;
+  +duration: DOMHighResTimeStamp;
+}
+
 export class PerformanceEntry {
-  #name: string;
-  #entryType: PerformanceEntryType;
-  #startTime: DOMHighResTimeStamp;
-  #duration: DOMHighResTimeStamp;
-
-  constructor(init: {
-    name: string,
-    entryType: PerformanceEntryType,
-    startTime: DOMHighResTimeStamp,
-    duration: DOMHighResTimeStamp,
-  }) {
-    this.#name = init.name;
-    this.#entryType = init.entryType;
-    this.#startTime = init.startTime;
-    this.#duration = init.duration;
+  // We don't use private fields because they're significantly slower to
+  // initialize on construction and to access.
+  // We also need these to be protected so they can be initialized in subclasses
+  // where we avoid calling `super()` for performance reasons.
+  __entryType: PerformanceEntryType;
+  __name: string;
+  __startTime: DOMHighResTimeStamp;
+  __duration: DOMHighResTimeStamp;
+
+  constructor(entryType: PerformanceEntryType, init: PerformanceEntryInit) {
+    this.__entryType = entryType;
+    this.__name = init.name;
+    this.__startTime = init.startTime;
+    this.__duration = init.duration;
   }
 
   get name(): string {
-    return this.#name;
+    return this.__name;
   }
 
   get entryType(): PerformanceEntryType {
-    return this.#entryType;
+    return this.__entryType;
   }
 
   get startTime(): DOMHighResTimeStamp {
-    return this.#startTime;
+    return this.__startTime;
   }
 
   get duration(): DOMHighResTimeStamp {
-    return this.#duration;
+    return this.__duration;
   }
 
   toJSON(): PerformanceEntryJSON {
     return {
-      name: this.#name,
-      entryType: this.#entryType,
-      startTime: this.#startTime,
-      duration: this.#duration,
+      name: this.__name,
+      entryType: this.__entryType,
+      startTime: this.__startTime,
+      duration: this.__duration,
     };
   }
 }
 
+export const PerformanceEntry_public: typeof PerformanceEntry =
+  /* eslint-disable no-shadow */
+  // $FlowExpectedError[incompatible-type]
+  function PerformanceEntry() {
+    throw new TypeError(
+      "Failed to construct 'PerformanceEntry': Illegal constructor",
+    );
+  };
+
+// $FlowExpectedError[prop-missing]
+PerformanceEntry_public.prototype = PerformanceEntry.prototype;
+
 setPlatformObject(PerformanceEntry);
 
 export type PerformanceEntryList = $ReadOnlyArray<PerformanceEntry>;

package/src/private/webapis/performance/PerformanceObserver.js

@@ -21,12 +21,13 @@ import {
   rawToPerformanceEntry,
   rawToPerformanceEntryType,
 } from './internals/RawPerformanceEntry';
-import {warnNoNativePerformance} from './internals/Utilities';
-import NativePerformance from './specs/NativePerformance';
+import MaybeNativePerformance from './specs/NativePerformance';
 import nullthrows from 'nullthrows';
 
 export {PerformanceEntry} from './PerformanceEntry';
 
+const NativePerformance = nullthrows(MaybeNativePerformance);
+
 export class PerformanceObserverEntryList {
   #entries: PerformanceEntryList;
 
@@ -56,6 +57,19 @@ export class PerformanceObserverEntryList {
   }
 }
 
+export const PerformanceObserverEntryList_public: typeof PerformanceObserverEntryList =
+  /* eslint-disable no-shadow */
+  // $FlowExpectedError[incompatible-type]
+  function PerformanceObserverEntryList() {
+    throw new TypeError(
+      "Failed to construct 'PerformanceObserverEntryList': Illegal constructor",
+    );
+  };
+
+// $FlowExpectedError[prop-missing]
+PerformanceObserverEntryList_public.prototype =
+  PerformanceObserverEntryList.prototype;
+
 export type PerformanceObserverCallbackOptions = {
   droppedEntriesCount: number,
 };
@@ -75,13 +89,6 @@ export interface PerformanceObserverInit {
 }
 
 function getSupportedPerformanceEntryTypes(): $ReadOnlyArray<PerformanceEntryType> {
-  if (!NativePerformance) {
-    return Object.freeze([]);
-  }
-  if (!NativePerformance.getSupportedPerformanceEntryTypes) {
-    // fallback if getSupportedPerformanceEntryTypes is not defined on native side
-    return Object.freeze(['mark', 'measure', 'event']);
-  }
   return Object.freeze(
     NativePerformance.getSupportedPerformanceEntryTypes().map(
       rawToPerformanceEntryType,
@@ -120,11 +127,6 @@ export class PerformanceObserver {
   }
 
   observe(options: PerformanceObserverInit): void {
-    if (!NativePerformance || NativePerformance.observe == null) {
-      warnNoNativePerformance();
-      return;
-    }
-
     this.#validateObserveOptions(options);
 
     if (this.#nativeObserverHandle == null) {
@@ -135,12 +137,12 @@ export class PerformanceObserver {
 
     if (options.entryTypes) {
       this.#type = 'multiple';
-      NativePerformance.observe?.(observerHandle, {
+      NativePerformance.observe(observerHandle, {
         entryTypes: options.entryTypes.map(performanceEntryTypeToRaw),
       });
     } else if (options.type) {
       this.#type = 'single';
-      NativePerformance.observe?.(observerHandle, {
+      NativePerformance.observe(observerHandle, {
         type: performanceEntryTypeToRaw(options.type),
         buffered: options.buffered,
         durationThreshold: options.durationThreshold,
@@ -149,33 +151,39 @@ export class PerformanceObserver {
   }
 
   disconnect(): void {
-    if (!NativePerformance) {
-      warnNoNativePerformance();
-      return;
-    }
-
-    if (this.#nativeObserverHandle == null || !NativePerformance.disconnect) {
+    if (this.#nativeObserverHandle == null) {
       return;
     }
 
     NativePerformance.disconnect(this.#nativeObserverHandle);
   }
 
-  #createNativeObserver(): OpaqueNativeObserverHandle | null {
-    if (!NativePerformance || !NativePerformance.createObserver) {
-      warnNoNativePerformance();
-      return null;
+  takeRecords(): PerformanceEntryList {
+    let entries: PerformanceEntryList = [];
+
+    if (this.#nativeObserverHandle != null) {
+      const rawEntries = NativePerformance.takeRecords(
+        this.#nativeObserverHandle,
+        true,
+      );
+      if (rawEntries && rawEntries.length > 0) {
+        entries = rawEntries.map(rawToPerformanceEntry);
+      }
     }
 
+    return entries;
+  }
+
+  #createNativeObserver(): OpaqueNativeObserverHandle | null {
     this.#calledAtLeastOnce = false;
 
     const observerHandle: OpaqueNativeObserverHandle =
       NativePerformance.createObserver(() => {
-        const rawEntries = NativePerformance.takeRecords?.(
+        const rawEntries = NativePerformance.takeRecords(
           observerHandle,
           true, // sort records
         );
-        if (!rawEntries) {
+        if (!rawEntries || rawEntries.length === 0) {
           return;
         }
 
@@ -185,7 +193,7 @@ export class PerformanceObserver {
         let droppedEntriesCount = 0;
         if (!this.#calledAtLeastOnce) {
           droppedEntriesCount =
-            NativePerformance.getDroppedEntriesCount?.(observerHandle) ?? 0;
+            NativePerformance.getDroppedEntriesCount(observerHandle);
           this.#calledAtLeastOnce = true;
         }
 

package/src/private/webapis/performance/ReactNativeStartupTiming.js

@@ -16,9 +16,7 @@ type ReactNativeStartupTimingLike = {
   startTime: ?number,
   endTime: ?number,
   initializeRuntimeStart: ?number,
-  initializeRuntimeEnd: ?number,
   executeJavaScriptBundleEntryPointStart: ?number,
-  executeJavaScriptBundleEntryPointEnd: ?number,
 };
 
 // Read-only object with RN startup timing information.
@@ -29,22 +27,17 @@ export default class ReactNativeStartupTiming {
   // 1. The `ReactNativeStartupTiming` is non-standard API
   // 2. The timing information is relative to the time origin, which means `0` has valid meaning
   #startTime: ?number;
-  #endTime: ?number;
   #initializeRuntimeStart: ?number;
-  #initializeRuntimeEnd: ?number;
   #executeJavaScriptBundleEntryPointStart: ?number;
-  #executeJavaScriptBundleEntryPointEnd: ?number;
+  #endTime: ?number;
 
   constructor(startUpTiming: ?ReactNativeStartupTimingLike) {
     if (startUpTiming != null) {
       this.#startTime = startUpTiming.startTime;
-      this.#endTime = startUpTiming.endTime;
       this.#initializeRuntimeStart = startUpTiming.initializeRuntimeStart;
-      this.#initializeRuntimeEnd = startUpTiming.initializeRuntimeEnd;
       this.#executeJavaScriptBundleEntryPointStart =
         startUpTiming.executeJavaScriptBundleEntryPointStart;
-      this.#executeJavaScriptBundleEntryPointEnd =
-        startUpTiming.executeJavaScriptBundleEntryPointEnd;
+      this.#endTime = startUpTiming.endTime;
     }
   }
 
@@ -56,7 +49,7 @@ export default class ReactNativeStartupTiming {
   }
 
   /**
-   * End time of the RN app startup process. This is equal to `executeJavaScriptBundleEntryPointEnd`.
+   * End time of the RN app startup process.
    */
   get endTime(): ?number {
     return this.#endTime;
@@ -69,26 +62,12 @@ export default class ReactNativeStartupTiming {
     return this.#initializeRuntimeStart;
   }
 
-  /**
-   * End time when RN runtime get initialized. This is the last marker before ends of the app startup process.
-   */
-  get initializeRuntimeEnd(): ?number {
-    return this.#initializeRuntimeEnd;
-  }
-
   /**
    * Start time of JS bundle being executed. This indicates the RN JS bundle is loaded and start to be evaluated.
    */
   get executeJavaScriptBundleEntryPointStart(): ?number {
     return this.#executeJavaScriptBundleEntryPointStart;
   }
-
-  /**
-   * End time of JS bundle being executed. This indicates all the synchronous entry point jobs are finished.
-   */
-  get executeJavaScriptBundleEntryPointEnd(): ?number {
-    return this.#executeJavaScriptBundleEntryPointEnd;
-  }
 }
 
 setPlatformObject(ReactNativeStartupTiming);

package/src/private/webapis/performance/ResourceTiming.js

@@ -29,6 +29,19 @@ export type PerformanceResourceTimingJSON = {
   ...
 };
 
+export interface PerformanceResourceTimingInit {
+  +name: string;
+  +startTime: DOMHighResTimeStamp;
+  +duration: DOMHighResTimeStamp;
+  +fetchStart: DOMHighResTimeStamp;
+  +requestStart: DOMHighResTimeStamp;
+  +connectStart: DOMHighResTimeStamp;
+  +connectEnd: DOMHighResTimeStamp;
+  +responseStart: DOMHighResTimeStamp;
+  +responseEnd: DOMHighResTimeStamp;
+  +responseStatus?: number;
+}
+
 export class PerformanceResourceTiming extends PerformanceEntry {
   #fetchStart: DOMHighResTimeStamp;
   #requestStart: DOMHighResTimeStamp;
@@ -38,24 +51,9 @@ export class PerformanceResourceTiming extends PerformanceEntry {
   #responseEnd: DOMHighResTimeStamp;
   #responseStatus: ?number;
 
-  constructor(init: {
-    name: string,
-    startTime: DOMHighResTimeStamp,
-    duration: DOMHighResTimeStamp,
-    fetchStart: DOMHighResTimeStamp,
-    requestStart: DOMHighResTimeStamp,
-    connectStart: DOMHighResTimeStamp,
-    connectEnd: DOMHighResTimeStamp,
-    responseStart: DOMHighResTimeStamp,
-    responseEnd: DOMHighResTimeStamp,
-    responseStatus?: number,
-  }) {
-    super({
-      name: init.name,
-      entryType: 'resource',
-      startTime: init.startTime,
-      duration: init.duration,
-    });
+  constructor(init: PerformanceResourceTimingInit) {
+    super('resource', init);
+
     this.#fetchStart = init.fetchStart;
     this.#requestStart = init.requestStart;
     this.#connectStart = init.connectStart;
@@ -106,3 +104,16 @@ export class PerformanceResourceTiming extends PerformanceEntry {
     };
   }
 }
+
+export const PerformanceResourceTiming_public: typeof PerformanceResourceTiming =
+  /* eslint-disable no-shadow */
+  // $FlowExpectedError[incompatible-type]
+  function PerformanceResourceTiming() {
+    throw new TypeError(
+      "Failed to construct 'PerformanceResourceTiming': Illegal constructor",
+    );
+  };
+
+// $FlowExpectedError[prop-missing]
+PerformanceResourceTiming_public.prototype =
+  PerformanceResourceTiming.prototype;

package/src/private/webapis/performance/UserTiming.js

@@ -9,64 +9,122 @@
  */
 
 // flowlint unsafe-getters-setters:off
+import type {
+  DOMHighResTimeStamp,
+  PerformanceEntryInit,
+} from './PerformanceEntry';
+import type {
+  ExtensionMarkerPayload,
+  ExtensionTrackEntryPayload,
+} from './UserTimingExtensibility';
 
-import type {DOMHighResTimeStamp} from './PerformanceEntry';
-
+import {getCurrentTimeStamp} from './internals/Utilities';
 import {PerformanceEntry} from './PerformanceEntry';
 
-export type DetailType = mixed;
+export type DetailType =
+  | mixed
+  // This will effectively ignored by Flow (mixed | anything = mixed)
+  // but we'll use it as documentation for how to use the extensibility API.
+  | {devtools?: ExtensionMarkerPayload | ExtensionTrackEntryPayload, ...};
 
-export type PerformanceMarkOptions = {
-  detail?: DetailType,
-  startTime?: DOMHighResTimeStamp,
-};
+export interface PerformanceMarkOptions {
+  +detail?: DetailType;
+  +startTime?: DOMHighResTimeStamp;
+}
 
 export type TimeStampOrName = DOMHighResTimeStamp | string;
 
-export type PerformanceMeasureInit = {
-  detail?: DetailType,
-  startTime: DOMHighResTimeStamp,
-  duration: DOMHighResTimeStamp,
-};
+export interface PerformanceMeasureInit extends PerformanceEntryInit {
+  +detail?: DetailType;
+}
 
-export class PerformanceMark extends PerformanceEntry {
-  #detail: DetailType;
+class PerformanceMarkTemplate extends PerformanceEntry {
+  // We don't use private fields because they're significantly slower to
+  // initialize on construction and to access.
+  __detail: DetailType;
 
+  // This constructor isn't really used. See `PerformanceMark` below.
   constructor(markName: string, markOptions?: PerformanceMarkOptions) {
-    super({
+    super('mark', {
       name: markName,
-      entryType: 'mark',
-      startTime: markOptions?.startTime ?? performance.now(),
+      startTime: markOptions?.startTime ?? getCurrentTimeStamp(),
       duration: 0,
     });
 
-    if (markOptions) {
-      this.#detail = markOptions.detail;
-    }
+    this.__detail = markOptions?.detail ?? null;
   }
 
   get detail(): DetailType {
-    return this.#detail;
+    return this.__detail;
   }
 }
 
-export class PerformanceMeasure extends PerformanceEntry {
-  #detail: DetailType;
+// This is the real value we're exporting where we define the class a function
+// so we don't need to call `super()` and we can avoid the performance penalty
+// of the current code transpiled with Babel.
+// We should remove this when we have built-in support for classes in the
+// runtime.
+export const PerformanceMark: typeof PerformanceMarkTemplate =
+  // $FlowExpectedError[incompatible-type]
+  function PerformanceMark(
+    this: PerformanceMarkTemplate,
+    markName: string,
+    markOptions?: PerformanceMarkOptions,
+  ) {
+    this.__entryType = 'mark';
+    this.__name = markName;
+    this.__startTime = markOptions?.startTime ?? getCurrentTimeStamp();
+    this.__duration = 0;
 
-  constructor(measureName: string, measureOptions: PerformanceMeasureInit) {
-    super({
-      name: measureName,
-      entryType: 'measure',
-      startTime: measureOptions.startTime,
-      duration: measureOptions.duration,
-    });
+    this.__detail = markOptions?.detail ?? null;
+  };
+
+// $FlowExpectedError[prop-missing]
+PerformanceMark.prototype = PerformanceMarkTemplate.prototype;
+
+class PerformanceMeasureTemplate extends PerformanceEntry {
+  // We don't use private fields because they're significantly slower to
+  // initialize on construction and to access.
+  __detail: DetailType;
 
-    if (measureOptions) {
-      this.#detail = measureOptions.detail;
-    }
+  // This constructor isn't really used. See `PerformanceMeasure` below.
+  constructor(init: PerformanceMeasureInit) {
+    super('measure', init);
+
+    this.__detail = init?.detail ?? null;
   }
 
   get detail(): DetailType {
-    return this.#detail;
+    return this.__detail;
   }
 }
+
+// We do the same here as we do for `PerformanceMark` for performance reasons.
+export const PerformanceMeasure: typeof PerformanceMeasureTemplate =
+  // $FlowExpectedError[incompatible-type]
+  function PerformanceMeasure(
+    this: PerformanceMeasureTemplate,
+    init: PerformanceMeasureInit,
+  ) {
+    this.__entryType = 'measure';
+    this.__name = init.name;
+    this.__startTime = init.startTime;
+    this.__duration = init.duration;
+
+    this.__detail = init.detail ?? null;
+  };
+
+// $FlowExpectedError[prop-missing]
+PerformanceMeasure.prototype = PerformanceMeasureTemplate.prototype;
+
+export const PerformanceMeasure_public: typeof PerformanceMeasure =
+  /* eslint-disable no-shadow */
+  // $FlowExpectedError[incompatible-type]
+  function PerformanceMeasure() {
+    throw new TypeError(
+      "Failed to construct 'PerformanceMeasure': Illegal constructor",
+    );
+  };
+
+// $FlowExpectedError[prop-missing]
+PerformanceMeasure_public.prototype = PerformanceMeasure.prototype;

package/src/private/webapis/performance/UserTimingExtensibility.js.flow

@@ -0,0 +1,38 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow strict
+ * @format
+ */
+
+export type DevToolsColor =
+  | 'primary'
+  | 'primary-light'
+  | 'primary-dark'
+  | 'secondary'
+  | 'secondary-light'
+  | 'secondary-dark'
+  | 'tertiary'
+  | 'tertiary-light'
+  | 'tertiary-dark'
+  | 'warning'
+  | 'error';
+
+export interface ExtensionTrackEntryPayload {
+  dataType?: 'track-entry'; // Defaults to "track-entry"
+  color?: DevToolsColor; // Defaults to "primary"
+  track: string; // Required: Name of the custom track
+  trackGroup?: string; // Optional: Group for organizing tracks
+  properties?: Array<[string, string]>; // Key-value pairs for detailed view
+  tooltipText?: string; // Short description for tooltip
+}
+
+export interface ExtensionMarkerPayload {
+  dataType: 'marker'; // Required: Identifies as a marker
+  color?: DevToolsColor; // Defaults to "primary"
+  properties?: Array<[string, string]>; // Key-value pairs for detailed view
+  tooltipText?: string; // Short description for tooltip
+}

package/src/private/webapis/performance/internals/RawPerformanceEntry.js

@@ -44,7 +44,6 @@ export function rawToPerformanceEntry(
     case RawPerformanceEntryTypeValues.LONGTASK:
       return new PerformanceLongTaskTiming({
         name: entry.name,
-        entryType: rawToPerformanceEntryType(entry.entryType),
         startTime: entry.startTime,
         duration: entry.duration,
       });
@@ -53,7 +52,8 @@ export function rawToPerformanceEntry(
         startTime: entry.startTime,
       });
     case RawPerformanceEntryTypeValues.MEASURE:
-      return new PerformanceMeasure(entry.name, {
+      return new PerformanceMeasure({
+        name: entry.name,
         startTime: entry.startTime,
         duration: entry.duration,
       });
@@ -71,9 +71,8 @@ export function rawToPerformanceEntry(
         responseStatus: entry.responseStatus,
       });
     default:
-      return new PerformanceEntry({
+      return new PerformanceEntry(rawToPerformanceEntryType(entry.entryType), {
         name: entry.name,
-        entryType: rawToPerformanceEntryType(entry.entryType),
         startTime: entry.startTime,
         duration: entry.duration,
       });

package/src/private/webapis/performance/internals/Utilities.js

@@ -9,6 +9,7 @@
  */
 
 import warnOnce from '../../../../../Libraries/Utilities/warnOnce';
+import NativePerformance from '../specs/NativePerformance';
 
 export function warnNoNativePerformance() {
   warnOnce(
@@ -16,3 +17,11 @@ export function warnNoNativePerformance() {
     'Missing native implementation of Performance',
   );
 }
+
+declare var global: {
+  // This value is defined directly via JSI, if available.
+  +nativePerformanceNow?: ?() => number,
+};
+
+export const getCurrentTimeStamp: () => DOMHighResTimeStamp =
+  NativePerformance?.now ?? global.nativePerformanceNow ?? (() => Date.now());

package/src/private/webapis/performance/specs/NativePerformance.js

@@ -53,49 +53,49 @@ export type PerformanceObserverInit = {
 };
 
 export interface Spec extends TurboModule {
-  +now?: () => number;
-  +markWithResult?: (
-    name: string,
-    startTime?: number,
-  ) => NativePerformanceMarkResult;
-  +measureWithResult?: (
+  +now: () => number;
+  +timeOrigin?: () => number;
+
+  +reportMark: (name: string, startTime: number, entry: mixed) => void;
+  +reportMeasure: (
     name: string,
     startTime: number,
-    endTime: number,
-    duration?: number,
-    startMark?: string,
-    endMark?: string,
-  ) => NativePerformanceMeasureResult;
-  +clearMarks?: (entryName?: string) => void;
-  +clearMeasures?: (entryName?: string) => void;
-  +getEntries?: () => $ReadOnlyArray<RawPerformanceEntry>;
-  +getEntriesByName?: (
+    duration: number,
+    entry: mixed,
+  ) => void;
+  +getMarkTime: (name: string) => ?number;
+  +clearMarks: (entryName?: string) => void;
+  +clearMeasures: (entryName?: string) => void;
+  +getEntries: () => $ReadOnlyArray<RawPerformanceEntry>;
+  +getEntriesByName: (
     entryName: string,
     entryType?: ?RawPerformanceEntryType,
   ) => $ReadOnlyArray<RawPerformanceEntry>;
-  +getEntriesByType?: (
+  +getEntriesByType: (
     entryType: RawPerformanceEntryType,
   ) => $ReadOnlyArray<RawPerformanceEntry>;
-  +getEventCounts?: () => $ReadOnlyArray<[string, number]>;
+  +getEventCounts: () => $ReadOnlyArray<[string, number]>;
   +getSimpleMemoryInfo: () => NativeMemoryInfo;
   +getReactNativeStartupTiming: () => ReactNativeStartupTiming;
 
-  +createObserver?: (
+  +createObserver: (
     callback: NativeBatchedObserverCallback,
   ) => OpaqueNativeObserverHandle;
-  +getDroppedEntriesCount?: (observer: OpaqueNativeObserverHandle) => number;
+  +getDroppedEntriesCount: (observer: OpaqueNativeObserverHandle) => number;
 
-  +observe?: (
+  +observe: (
     observer: OpaqueNativeObserverHandle,
     options: PerformanceObserverInit,
   ) => void;
-  +disconnect?: (observer: OpaqueNativeObserverHandle) => void;
-  +takeRecords?: (
+  +disconnect: (observer: OpaqueNativeObserverHandle) => void;
+  +takeRecords: (
     observer: OpaqueNativeObserverHandle,
     sort: boolean,
   ) => $ReadOnlyArray<RawPerformanceEntry>;
 
-  +getSupportedPerformanceEntryTypes?: () => $ReadOnlyArray<RawPerformanceEntryType>;
+  +getSupportedPerformanceEntryTypes: () => $ReadOnlyArray<RawPerformanceEntryType>;
+
+  +clearEventCountsForTesting: () => void;
 }
 
 export default (TurboModuleRegistry.get<Spec>('NativePerformanceCxx'): ?Spec);