ci metrics collection issues

Author: vaind

packages/replay/metrics/configs/ci/collect.ts

@@ -18,7 +18,7 @@ function checkStdDev(stats: MetricsStats, name: string, provider: NumberProvider
   return true;
 }
 
-const collector = new MetricsCollector({ headless: true });
+const collector = new MetricsCollector({ headless: true, cpuThrottling: 2 });
 const result = await collector.execute({
   name: 'jank',
   a: new JankTestScenario(false),

packages/replay/metrics/configs/dev/collect.ts

@@ -1,6 +1,7 @@
 import { Metrics, MetricsCollector } from '../../src/collector.js';
 import { MetricsStats } from '../../src/results/metrics-stats.js';
 import { JankTestScenario } from '../../src/scenarios.js';
+import { printStats } from '../../src/util/console.js';
 import { latestResultFile } from './env.js';
 
 const collector = new MetricsCollector();
@@ -12,6 +13,8 @@ const result = await collector.execute({
   tries: 1,
   async shouldAccept(results: Metrics[]): Promise<boolean> {
     const stats = new MetricsStats(results);
+    printStats(stats);
+
     const cpuUsage = stats.mean(MetricsStats.cpu)!;
     if (cpuUsage > 0.9) {
       console.error(`CPU usage too high to be accurate: ${(cpuUsage * 100).toFixed(2)} %.`,

packages/replay/metrics/src/collector.ts

@@ -9,7 +9,6 @@ import { Scenario, TestCase } from './scenarios.js';
 import { consoleGroup } from './util/console.js';
 import { WebVitals, WebVitalsCollector } from './vitals/index.js';
 
-const cpuThrottling = 4;
 const networkConditions = 'Fast 3G';
 
 // Same as puppeteer-core PredefinedNetworkConditions
@@ -42,6 +41,7 @@ export class Metrics {
 
 export interface MetricsCollectorOptions {
   headless: boolean;
+  cpuThrottling: number;
 }
 
 export class MetricsCollector {
@@ -50,6 +50,7 @@ export class MetricsCollector {
   constructor(options?: Partial<MetricsCollectorOptions>) {
     this._options = {
       headless: false,
+      cpuThrottling: 4,
       ...options
     };
   }
@@ -59,7 +60,7 @@ export class MetricsCollector {
     return consoleGroup(async () => {
       const aResults = await this._collect(testCase, 'A', testCase.a);
       const bResults = await this._collect(testCase, 'B', testCase.b);
-      return new Result(testCase.name, cpuThrottling, networkConditions, aResults, bResults);
+      return new Result(testCase.name, this._options.cpuThrottling, networkConditions, aResults, bResults);
     });
   }
 
@@ -119,7 +120,7 @@ export class MetricsCollector {
           uploadThroughput: PredefinedNetworkConditions[networkConditions].upload,
           downloadThroughput: PredefinedNetworkConditions[networkConditions].download,
         });
-        await cdp.send('Emulation.setCPUThrottlingRate', { rate: cpuThrottling });
+        await cdp.send('Emulation.setCPUThrottlingRate', { rate: this._options.cpuThrottling });
 
         // Collect CPU and memory info 10 times per second.
         const perfSampler = await PerfMetricsSampler.create(cdp, 100);

packages/replay/metrics/src/util/console.ts

@@ -13,8 +13,8 @@ type PrintableTable = { [k: string]: any };
 
 export function printStats(stats: MetricsStats): void {
   console.table({
-    lcp: `${stats.mean(MetricsStats.lcp)?.toFixed(2)} %`,
-    cls: `${stats.mean(MetricsStats.cls)?.toFixed(2)} %`,
+    lcp: `${stats.mean(MetricsStats.lcp)?.toFixed(2)} ms`,
+    cls: `${stats.mean(MetricsStats.cls)?.toFixed(2)} ms`,
     cpu: `${((stats.mean(MetricsStats.cpu) || 0) * 100).toFixed(2)} %`,
     memoryMean: filesize(stats.mean(MetricsStats.memoryMean)),
     memoryMax: filesize(stats.max(MetricsStats.memoryMax)),