perf: load the Lighthouse bundle on first use (#3169)

The Lighthouse bundle is large and only the Lighthouse tool uses it. The
static import added about 190 ms to every process that imports
third_party/index.js: the MCP server, the CLI, the daemon and each test
file. Load the bundle with a dynamic import on the first audit instead.

Import time of the bundled third_party/index.js: 586 ms to 450 ms.

scripts/profile/scenarios/get_css_styles.ts

@@ -10,7 +10,9 @@ import {uidsFromSnapshotResult} from '../utils.ts';
 export function getNumIterations(): ScenarioIterations {
   return {
     iterations: 10,
-    warmupIterations: 10,
+    // V8 still compiles get_css_styles code after 10 warm-up iterations. That
+    // compiled code shows as heap growth in the measured iterations.
+    warmupIterations: 20,
   };
 }
 

src/third_party/index.ts

@@ -12,11 +12,7 @@ import type {Flags, OutputMode, Result, RunnerResult} from 'lighthouse';
 import type {Page} from 'puppeteer-core';
 import {z as zod} from 'zod';
 
-import {
-  snapshot as snapshotImpl,
-  navigation as navigationImpl,
-  generateReport as generateReportImpl,
-} from './lighthouse-devtools-mcp-bundle.js';
+import type * as LighthouseBundle from './lighthouse-devtools-mcp-bundle.js';
 
 export type {Flags, Result, RunnerResult, OutputMode};
 
@@ -100,21 +96,38 @@ export async function getGcfEncode(): Promise<(val: unknown) => string> {
   return encodeGeneric;
 }
 
+let lighthouseBundle: Promise<typeof LighthouseBundle> | undefined;
+
+/**
+ * Loads the Lighthouse bundle on first use. The bundle is large and only the
+ * Lighthouse tool uses it, so a static import slows down every process start.
+ */
+function loadLighthouse(): Promise<typeof LighthouseBundle> {
+  lighthouseBundle ??= import('./lighthouse-devtools-mcp-bundle.js');
+  return lighthouseBundle;
+}
+
 export const lighthouseRunner = {
-  snapshot: snapshotImpl as (
-    page: Page,
-    options: {flags?: Flags},
-  ) => Promise<RunnerResult>,
-  navigation: navigationImpl as (
+  async snapshot(page: Page, options: {flags?: Flags}): Promise<RunnerResult> {
+    const {snapshot} = await loadLighthouse();
+    return await snapshot(page, options);
+  },
+  async navigation(
     page: Page,
     url: string,
     options: {flags?: Flags},
-  ) => Promise<RunnerResult>,
+  ): Promise<RunnerResult> {
+    const {navigation} = await loadLighthouse();
+    return await navigation(page, url, options);
+  },
 };
 
-export const generateReport = generateReportImpl as (
+export async function generateReport(
   lhr: Result,
   format: string,
-) => string;
+): Promise<string> {
+  const lighthouse = await loadLighthouse();
+  return lighthouse.generateReport(lhr, format);
+}
 
 export * as DevTools from '../../third_party/devtools-frontend/mcp/mcp.js';

src/tools/lighthouse.ts

@@ -258,7 +258,7 @@ export const lighthouseAudit = definePageTool((args: ParsedArguments) => ({
 
     const encoder = new TextEncoder();
     const savePromises = formats.map(async format => {
-      const report = generateReport(lhr, format);
+      const report = await generateReport(lhr, format);
       const data = encoder.encode(report);
       if (outputDirPath) {
         const reportPath = path.join(outputDirPath, `report`);