upstream-twenty/packages/twenty-website/scripts/lcp-report.mjs

import { chromium } from 'playwright';

// Same-run LCP comparison: both sites measured back to back under the
// same throttle (Fast-3G-ish network, 4x CPU), 3 cold loads each, median
// reported. A report, not a gate — run at wave close.
const OLD_URL = process.env.MOCKUP_OLD_URL ?? 'http://localhost:3002/';
const NEW_URL = process.env.VISUAL_BATTERY_URL ?? 'http://localhost:3004/';
const RUNS = 3;

const browser = await chromium.launch({ channel: 'chrome', headless: true });

async function measureLcp(url) {
  const context = await browser.newContext({
    viewport: { width: 1440, height: 900 },
    deviceScaleFactor: 1,
  });
  const page = await context.newPage();
  const cdp = await context.newCDPSession(page);
  await cdp.send('Network.emulateNetworkConditions', {
    offline: false,
    latency: 150,
    downloadThroughput: (1.6 * 1024 * 1024) / 8,
    uploadThroughput: (750 * 1024) / 8,
  });
  await cdp.send('Emulation.setCPUThrottlingRate', { rate: 4 });

  await page.addInitScript(() => {
    window.__lcp = 0;
    new PerformanceObserver((entryList) => {
      for (const entry of entryList.getEntries()) {
        window.__lcp = entry.startTime;
      }
    }).observe({ type: 'largest-contentful-paint', buffered: true });
  });

  await page.goto(url, { waitUntil: 'load', timeout: 240000 });
  await page.waitForTimeout(3000);
  const lcp = await page.evaluate(() => window.__lcp);
  await context.close();
  return lcp;
}

const median = (values) =>
  values.toSorted((a, b) => a - b)[Math.floor(values.length / 2)];

const report = {};
for (const [label, url] of [
  ['old (:3002)', OLD_URL],
  ['new (:3004)', NEW_URL],
]) {
  const samples = [];
  for (let run = 0; run < RUNS; run += 1) {
    // eslint-disable-next-line no-await-in-loop
    samples.push(await measureLcp(url));
  }
  report[label] = { samples, median: median(samples) };
  console.log(
    `  ${label}: median ${Math.round(median(samples))}ms (${samples
      .map((sample) => Math.round(sample))
      .join(', ')})`,
  );
}

await browser.close();

const oldMedian = report['old (:3002)'].median;
const newMedian = report['new (:3004)'].median;
const delta = ((newMedian - oldMedian) / oldMedian) * 100;
console.log(
  `lcp-report: new is ${delta <= 0 ? '' : '+'}${delta.toFixed(1)}% vs old`,
);