Extract benchmarking utilities into library

apps/benchmarking-test-app/App.tsx

@@ -8,89 +8,92 @@
  * @format
  */
 
-import { useCallback, useState } from "react";
-
-import { Button, SafeAreaView, StatusBar } from "react-native";
-import { Benchmark, simpleBenchmark } from "./src/benchmarks";
+import { SafeAreaView, StatusBar } from "react-native";
+import { simpleBenchmark } from "./src/benchmarks";
 import { bitEcsBenchmark } from "./src/benchmarks/bitEcsBenchmark";
 import { threeJsBenchmark } from "./src/benchmarks/threeJsBenchmark";
-import { JavaScriptEngineVersion } from "./src/JavaScriptEngineVersion";
 import { hyperfluxBenchmark } from "./src/benchmarks/hyperfluxBenchmark";
 import { irEcsBenchmark } from "./src/benchmarks/irEcsBenchmark";
 import { runHelloTriangle } from "./src/graphicsBenchmarks/HelloTriangle";
-import { GraphicsBenchmark } from "./src/graphicsBenchmarks/GraphicsBenchmark";
 import { runSignedDistanceField } from "./src/graphicsBenchmarks/SignedDistanceField";
 import { runDragonFxaa } from "./src/graphicsBenchmarks/DragonFxaa";
 import { runRayTracer } from "./src/graphicsBenchmarks/RayTracer";
 import {
   runScreenSpaceGlobalIllumination,
   runScreenSpaceReflection,
 } from "./src/graphicsBenchmarks/ScreenSpaceGlobalIllumination";
+import {
+  BenchmarkDescriptor,
+  BenchmarkHarness,
+} from "react-native-benchmarking-library";
 
-const App = () => {
-  const [flamegraphEnabled, setFlamegraphEnabled] = useState(false);
-
-  const toggleFlamegraph = useCallback(() => {
-    setFlamegraphEnabled((enabled) => !enabled);
-  }, []);
-
-  const toggleFlamegraphTitle = flamegraphEnabled
-    ? "Disable Flamegraph"
-    : "Enable Flamegraph";
+const BENCHMARK_MATRIX: BenchmarkDescriptor[] = [
+  {
+    title: "simpleBenchmark",
+    benchmarkType: "headless",
+    benchmarkFn: simpleBenchmark,
+  },
+  {
+    title: "bitEcsBenchmark",
+    benchmarkType: "headless",
+    benchmarkFn: bitEcsBenchmark,
+  },
+  {
+    title: "threeJsBenchmark",
+    benchmarkType: "headless",
+    benchmarkFn: threeJsBenchmark,
+  },
+  {
+    title: "hyperfluxBenchmark",
+    benchmarkType: "headless",
+    benchmarkFn: hyperfluxBenchmark,
+  },
+  {
+    title: "irEcsBenchmark",
+    benchmarkType: "headless",
+    benchmarkFn: irEcsBenchmark,
+  },
+  {
+    title: "triangleWebGpuBenchmark",
+    benchmarkType: "graphics",
+    benchmarkFn: runHelloTriangle,
+  },
+  {
+    title: "sdfWebGpuBenchmark",
+    benchmarkType: "graphics",
+    benchmarkFn: runSignedDistanceField,
+  },
+  {
+    title: "dragonFxaaBenchmark",
+    benchmarkType: "graphics",
+    benchmarkFn: runDragonFxaa,
+  },
+  {
+    title: "ssgiBenchmark",
+    benchmarkType: "graphics",
+    benchmarkFn: runScreenSpaceGlobalIllumination,
+  },
+  {
+    title: "ssrBenchmark",
+    benchmarkType: "graphics",
+    benchmarkFn: runScreenSpaceReflection,
+  },
+  {
+    title: "rayTracerBenchmark",
+    benchmarkType: "graphics",
+    benchmarkFn: runRayTracer,
+  },
+];
 
+const App = () => {
   return (
     <>
       <StatusBar barStyle="dark-content" />
       <SafeAreaView
         style={{ flex: 1, backgroundColor: "white" }}
         accessibilityLabel="benchmarkSafeArea"
       >
-        <JavaScriptEngineVersion />
-        <Button
-          testID="toggleFlamegraph"
-          title={toggleFlamegraphTitle}
-          onPress={toggleFlamegraph}
-        />
-        <Benchmark
-          flamegraphEnabled={flamegraphEnabled}
-          name="simpleBenchmark"
-          run={simpleBenchmark}
-        />
-        <Benchmark
-          flamegraphEnabled={flamegraphEnabled}
-          name="bitEcsBenchmark"
-          run={bitEcsBenchmark}
-        />
-        <Benchmark
-          flamegraphEnabled={flamegraphEnabled}
-          name="threeJsBenchmark"
-          run={threeJsBenchmark}
-        />
-        <Benchmark
-          flamegraphEnabled={flamegraphEnabled}
-          name="hyperfluxBenchmark"
-          run={hyperfluxBenchmark}
-        />
-        <Benchmark
-          flamegraphEnabled={flamegraphEnabled}
-          name="irEcsBenchmark"
-          run={irEcsBenchmark}
-        />
-        <GraphicsBenchmark
-          run={runHelloTriangle}
-          name="triangleWebGpuBenchmark"
-        />
-        <GraphicsBenchmark
-          run={runSignedDistanceField}
-          name="sdfWebGpuBenchmark"
-        />
-        <GraphicsBenchmark run={runDragonFxaa} name="dragonFxaaBenchmark" />
-        <GraphicsBenchmark
-          run={runScreenSpaceGlobalIllumination}
-          name="ssgiBenchmark"
-        />
-        <GraphicsBenchmark run={runScreenSpaceReflection} name="ssrBenchmark" />
-        <GraphicsBenchmark run={runRayTracer} name="rayTracerBenchmark" />
+        <BenchmarkHarness items={BENCHMARK_MATRIX} />
       </SafeAreaView>
     </>
   );

apps/benchmarking-test-app/ios/Podfile.lock

@@ -1260,7 +1260,7 @@ PODS:
     - ReactCommon/turbomodule/bridging
     - ReactCommon/turbomodule/core
     - Yoga
-  - react-native-wgpu (0.1.8):
+  - react-native-wgpu (0.1.18):
     - DoubleConversion
     - glog
     - hermes-engine
@@ -1828,7 +1828,7 @@ SPEC CHECKSUMS:
   React-microtasksnativemodule: a6501ae1ad0b09070e3c00f5e8150106c0dcde65
   react-native-get-random-values: 21325b2244dfa6b58878f51f9aa42821e7ba3d06
   react-native-release-profiler: d4395df9845d1a30fc77a9e8bd15f08c09fe47f5
-  react-native-wgpu: 336ca48df0124ddce4290340306b6f5a93bb892c
+  react-native-wgpu: d43605822e044e7d5b6ec2ff459d47494766b0b9
   React-nativeconfig: 271a4a10146950e1ff9825e7f0f84898502a7d84
   React-NativeModulesApple: 445c2907955516f0e9abb4b6ce6b7db5531e42ea
   React-perflogger: 9c9a8c6b3a0c8956d4201772759a1285450ae301

apps/benchmarking-test-app/package.json

@@ -28,6 +28,7 @@
     "node-schedule": "^2.1.1",
     "react": "18.2.0",
     "react-native": "^0.75.0",
+    "react-native-benchmarking-library": "1.0.0",
     "react-native-get-random-values": "^1.11.0",
     "react-native-permissions": "^3.10.1",
     "react-native-release-profiler": "^0.2.1",

apps/benchmarking-test-app/src/benchmarks/index.ts

@@ -1,2 +1 @@
-export * from "./Benchmark";
 export * from "./simpleBenchmark";