Feat: import timings and bundle size analysis (#2114)

* cursor should ignore .env files

* fix for duplicate builds when starting dev

* output metafile in dev

* attach metafile to background worker

* attach import timings to worker manifest

* warn during dev if imports take more than 1s

* add analyze command

* update disable warnings flag message

* add changeset

Author: nicktrn

.changeset/late-dancers-smile.md

@@ -0,0 +1,6 @@
+---
+"trigger.dev": patch
+"@trigger.dev/core": patch
+---
+
+Add import timings and bundle size analysis, the dev command will now warn about slow imports

.cursorignore

@@ -4,4 +4,5 @@ apps/proxy/
 apps/coordinator/
 packages/rsc/
 .changeset
-.zed
+.zed
+.env

packages/cli-v3/src/cli/index.ts

@@ -6,6 +6,7 @@ import { configureLogoutCommand } from "../commands/logout.js";
 import { configureWhoamiCommand } from "../commands/whoami.js";
 import { COMMAND_NAME } from "../consts.js";
 import { configureListProfilesCommand } from "../commands/list-profiles.js";
+import { configureAnalyzeCommand } from "../commands/analyze.js";
 import { configureUpdateCommand } from "../commands/update.js";
 import { VERSION } from "../version.js";
 import { configureDeployCommand } from "../commands/deploy.js";
@@ -34,6 +35,7 @@ configureListProfilesCommand(program);
 configureSwitchProfilesCommand(program);
 configureUpdateCommand(program);
 configurePreviewCommand(program);
+configureAnalyzeCommand(program);
 // configureWorkersCommand(program);
 // configureTriggerTaskCommand(program);
 

packages/cli-v3/src/commands/analyze.ts

@@ -0,0 +1,150 @@
+import { Command } from "commander";
+import { z } from "zod";
+import { CommonCommandOptions, handleTelemetry, wrapCommandAction } from "../cli/common.js";
+import { printInitialBanner } from "../utilities/initialBanner.js";
+import { logger } from "../utilities/logger.js";
+import { printBundleTree, printBundleSummaryTable } from "../utilities/analyze.js";
+import path from "node:path";
+import fs from "node:fs";
+import { readJSONFile } from "../utilities/fileSystem.js";
+import { WorkerManifest } from "@trigger.dev/core/v3";
+import { tryCatch } from "@trigger.dev/core";
+
+const AnalyzeOptions = CommonCommandOptions.pick({
+  logLevel: true,
+  skipTelemetry: true,
+}).extend({
+  verbose: z.boolean().optional().default(false),
+});
+
+type AnalyzeOptions = z.infer<typeof AnalyzeOptions>;
+
+export function configureAnalyzeCommand(program: Command) {
+  return program
+    .command("analyze [dir]", { hidden: true })
+    .description("Analyze your build output (bundle size, timings, etc)")
+    .option(
+      "-l, --log-level <level>",
+      "The CLI log level to use (debug, info, log, warn, error, none). This does not effect the log level of your trigger.dev tasks.",
+      "log"
+    )
+    .option("--skip-telemetry", "Opt-out of sending telemetry")
+    .option("--verbose", "Show detailed bundle tree (do not collapse bundles)")
+    .action(async (dir, options) => {
+      await handleTelemetry(async () => {
+        await analyzeCommand(dir, options);
+      });
+    });
+}
+
+export async function analyzeCommand(dir: string | undefined, options: unknown) {
+  return await wrapCommandAction("analyze", AnalyzeOptions, options, async (opts) => {
+    await printInitialBanner(false);
+    return await analyze(dir, opts);
+  });
+}
+
+export async function analyze(dir: string | undefined, options: AnalyzeOptions) {
+  const cwd = process.cwd();
+  const targetDir = dir ? path.resolve(cwd, dir) : cwd;
+  const metafilePath = path.join(targetDir, "metafile.json");
+  const manifestPath = path.join(targetDir, "index.json");
+
+  if (!fs.existsSync(metafilePath)) {
+    logger.error(`Could not find metafile.json in ${targetDir}`);
+    logger.info("Make sure you have built your project and metafile.json exists.");
+    return;
+  }
+  if (!fs.existsSync(manifestPath)) {
+    logger.error(`Could not find index.json (worker manifest) in ${targetDir}`);
+    logger.info("Make sure you have built your project and index.json exists.");
+    return;
+  }
+
+  const [metafileError, metafile] = await tryCatch(readMetafile(metafilePath));
+
+  if (metafileError) {
+    logger.error(`Failed to parse metafile.json: ${metafileError.message}`);
+    return;
+  }
+
+  const [manifestError, manifest] = await tryCatch(readManifest(manifestPath));
+
+  if (manifestError) {
+    logger.error(`Failed to parse index.json: ${manifestError.message}`);
+    return;
+  }
+
+  printBundleTree(manifest, metafile, {
+    preservePath: true,
+    collapseBundles: !options.verbose,
+  });
+
+  printBundleSummaryTable(manifest, metafile, {
+    preservePath: true,
+  });
+}
+
+async function readMetafile(metafilePath: string): Promise<Metafile> {
+  const json = await readJSONFile(metafilePath);
+  const metafile = MetafileSchema.parse(json);
+  return metafile;
+}
+
+async function readManifest(manifestPath: string): Promise<WorkerManifest> {
+  const json = await readJSONFile(manifestPath);
+  const manifest = WorkerManifest.parse(json);
+  return manifest;
+}
+
+const ImportKind = z.enum([
+  "entry-point",
+  "import-statement",
+  "require-call",
+  "dynamic-import",
+  "require-resolve",
+  "import-rule",
+  "composes-from",
+  "url-token",
+]);
+
+const ImportSchema = z.object({
+  path: z.string(),
+  kind: ImportKind,
+  external: z.boolean().optional(),
+  original: z.string().optional(),
+  with: z.record(z.string()).optional(),
+});
+
+const InputSchema = z.object({
+  bytes: z.number(),
+  imports: z.array(ImportSchema),
+  format: z.enum(["cjs", "esm"]).optional(),
+  with: z.record(z.string()).optional(),
+});
+
+const OutputImportSchema = z.object({
+  path: z.string(),
+  kind: z.union([ImportKind, z.literal("file-loader")]),
+  external: z.boolean().optional(),
+});
+
+const OutputInputSchema = z.object({
+  bytesInOutput: z.number(),
+});
+
+const OutputSchema = z.object({
+  bytes: z.number(),
+  inputs: z.record(z.string(), OutputInputSchema),
+  imports: z.array(OutputImportSchema),
+  exports: z.array(z.string()),
+  entryPoint: z.string().optional(),
+  cssBundle: z.string().optional(),
+});
+
+const MetafileSchema = z.object({
+  inputs: z.record(z.string(), InputSchema),
+  outputs: z.record(z.string(), OutputSchema),
+});
+
+type Metafile = z.infer<typeof MetafileSchema>;

packages/cli-v3/src/commands/dev.ts

@@ -1,5 +1,5 @@
 import { ResolvedConfig } from "@trigger.dev/core/v3/build";
-import { Command } from "commander";
+import { Command, Option as CommandOption } from "commander";
 import { z } from "zod";
 import { CommonCommandOptions, commonOptions, wrapCommandAction } from "../cli/common.js";
 import { watchConfig } from "../config.js";
@@ -24,6 +24,8 @@ const DevCommandOptions = CommonCommandOptions.extend({
   maxConcurrentRuns: z.coerce.number().optional(),
   mcp: z.boolean().default(false),
   mcpPort: z.coerce.number().optional().default(3333),
+  analyze: z.boolean().default(false),
+  disableWarnings: z.boolean().default(false),
 });
 
 export type DevCommandOptions = z.infer<typeof DevCommandOptions>;
@@ -54,6 +56,10 @@ export function configureDevCommand(program: Command) {
       )
       .option("--mcp", "Start the MCP server")
       .option("--mcp-port", "The port to run the MCP server on", "3333")
+      .addOption(
+        new CommandOption("--analyze", "Analyze the build output and import timings").hideHelp()
+      )
+      .addOption(new CommandOption("--disable-warnings", "Suppress warnings output").hideHelp())
   ).action(async (options) => {
     wrapCommandAction("dev", DevCommandOptions, options, async (opts) => {
       await devCommand(opts);

packages/cli-v3/src/dev/backgroundWorker.ts

@@ -5,6 +5,7 @@ import { indexWorkerManifest } from "../indexing/indexWorkerManifest.js";
 import { prettyError } from "../utilities/cliOutput.js";
 import { writeJSONFile } from "../utilities/fileSystem.js";
 import { logger } from "../utilities/logger.js";
+import type { Metafile } from "esbuild";
 
 export type BackgroundWorkerOptions = {
   env: Record<string, string>;
@@ -19,6 +20,7 @@ export class BackgroundWorker {
 
   constructor(
     public build: BuildManifest,
+    public metafile: Metafile,
     public params: BackgroundWorkerOptions
   ) {}
 

packages/cli-v3/src/dev/devOutput.ts

@@ -26,6 +26,7 @@ import { eventBus, EventBusEventArgs } from "../utilities/eventBus.js";
 import { logger } from "../utilities/logger.js";
 import { Socket } from "socket.io-client";
 import { BundleError } from "../build/bundle.js";
+import { analyzeWorker } from "../utilities/analyze.js";
 
 export type DevOutputOptions = {
   name: string | undefined;
@@ -71,6 +72,8 @@ export function startDevOutput(options: DevOutputOptions) {
   const backgroundWorkerInitialized = (
     ...[worker]: EventBusEventArgs<"backgroundWorkerInitialized">
   ) => {
+    analyzeWorker(worker, options.args.analyze, options.args.disableWarnings);
+
     const logParts: string[] = [];
 
     const testUrl = `${dashboardUrl}/projects/v3/${config.project}/test?environment=dev`;

packages/cli-v3/src/dev/devSession.ts

@@ -24,7 +24,8 @@ import { clearTmpDirs, EphemeralDirectory, getTmpDir } from "../utilities/tempDi
 import { startDevOutput } from "./devOutput.js";
 import { startWorkerRuntime } from "./devSupervisor.js";
 import { startMcpServer, stopMcpServer } from "./mcpServer.js";
-import { aiHelpLink } from "../utilities/cliOutput.js";
+import { writeJSONFile } from "../utilities/fileSystem.js";
+import { join } from "node:path";
 
 export type DevSessionOptions = {
   name: string | undefined;
@@ -105,12 +106,21 @@ export async function startDevSession({
 
     logger.debug("Created build manifest from bundle", { buildManifest });
 
+    await writeJSONFile(
+      join(workerDir?.path ?? destination.path, "metafile.json"),
+      bundle.metafile
+    );
+
     buildManifest = await notifyExtensionOnBuildComplete(buildContext, buildManifest);
 
     try {
       logger.debug("Updated bundle", { bundle, buildManifest });
 
-      await runtime.initializeWorker(buildManifest, workerDir?.remove ?? (() => {}));
+      await runtime.initializeWorker(
+        buildManifest,
+        bundle.metafile,
+        workerDir?.remove ?? (() => {})
+      );
     } catch (error) {
       if (error instanceof Error) {
         eventBus.emit("backgroundWorkerIndexingError", buildManifest, error);
@@ -160,8 +170,9 @@ export async function startDevSession({
         }
 
         if (!bundled) {
-          // First bundle, no need to update bundle
           bundled = true;
+          logger.debug("First bundle, no need to update bundle");
+          return;
         }
 
         const workerDir = getTmpDir(rawConfig.workingDir, "build", keepTmpFiles);

packages/cli-v3/src/dev/devSupervisor.ts

@@ -12,7 +12,6 @@ import { CliApiClient } from "../apiClient.js";
 import { DevCommandOptions } from "../commands/dev.js";
 import { eventBus } from "../utilities/eventBus.js";
 import { logger } from "../utilities/logger.js";
-import { sanitizeEnvVars } from "../utilities/sanitizeEnvVars.js";
 import { resolveSourceFiles } from "../utilities/sourceFiles.js";
 import { BackgroundWorker } from "./backgroundWorker.js";
 import { WorkerRuntime } from "./workerRuntime.js";
@@ -25,6 +24,7 @@ import {
 } from "@trigger.dev/core/v3/workers";
 import pLimit from "p-limit";
 import { resolveLocalEnvVars } from "../utilities/localEnvVars.js";
+import type { Metafile } from "esbuild";
 
 export type WorkerRuntimeOptions = {
   name: string | undefined;
@@ -113,7 +113,11 @@ class DevSupervisor implements WorkerRuntime {
     }
   }
 
-  async initializeWorker(manifest: BuildManifest, stop: () => void): Promise<void> {
+  async initializeWorker(
+    manifest: BuildManifest,
+    metafile: Metafile,
+    stop: () => void
+  ): Promise<void> {
     if (this.lastManifest && this.lastManifest.contentHash === manifest.contentHash) {
       logger.debug("worker skipped", { lastManifestContentHash: this.lastManifest?.contentHash });
       eventBus.emit("workerSkipped");
@@ -123,7 +127,7 @@ class DevSupervisor implements WorkerRuntime {
 
     const env = await this.#getEnvVars();
 
-    const backgroundWorker = new BackgroundWorker(manifest, {
+    const backgroundWorker = new BackgroundWorker(manifest, metafile, {
       env,
       cwd: this.options.config.workingDir,
       stop,

packages/cli-v3/src/dev/workerRuntime.ts

@@ -2,10 +2,11 @@ import { BuildManifest } from "@trigger.dev/core/v3";
 import { ResolvedConfig } from "@trigger.dev/core/v3/build";
 import { CliApiClient } from "../apiClient.js";
 import { DevCommandOptions } from "../commands/dev.js";
+import type { Metafile } from "esbuild";
 
 export interface WorkerRuntime {
   shutdown(): Promise<void>;
-  initializeWorker(manifest: BuildManifest, stop: () => void): Promise<void>;
+  initializeWorker(manifest: BuildManifest, metafile: Metafile, stop: () => void): Promise<void>;
 }
 
 export type WorkerRuntimeOptions = {

packages/cli-v3/src/entryPoints/dev-index-worker.ts

@@ -86,17 +86,18 @@ async function bootstrap() {
     forceFlushTimeoutMillis: 30_000,
   });
 
-  const importErrors = await registerResources(buildManifest);
+  const { importErrors, timings } = await registerResources(buildManifest);
 
   return {
     tracingSDK,
     config,
     buildManifest,
     importErrors,
+    timings,
   };
 }
 
-const { buildManifest, importErrors, config } = await bootstrap();
+const { buildManifest, importErrors, config, timings } = await bootstrap();
 
 let tasks = resourceCatalog.listTaskManifests();
 
@@ -158,6 +159,7 @@ await sendMessageInCatalog(
       loaderEntryPoint: buildManifest.loaderEntryPoint,
       customConditions: buildManifest.customConditions,
       initEntryPoint: buildManifest.initEntryPoint,
+      timings,
     },
     importErrors,
   },

packages/cli-v3/src/entryPoints/managed-index-worker.ts

@@ -86,17 +86,18 @@ async function bootstrap() {
     forceFlushTimeoutMillis: 30_000,
   });
 
-  const importErrors = await registerResources(buildManifest);
+  const { importErrors, timings } = await registerResources(buildManifest);
 
   return {
     tracingSDK,
     config,
     buildManifest,
     importErrors,
+    timings,
   };
 }
 
-const { buildManifest, importErrors, config } = await bootstrap();
+const { buildManifest, importErrors, config, timings } = await bootstrap();
 
 let tasks = resourceCatalog.listTaskManifests();
 
@@ -158,6 +159,7 @@ await sendMessageInCatalog(
       loaderEntryPoint: buildManifest.loaderEntryPoint,
       customConditions: buildManifest.customConditions,
       initEntryPoint: buildManifest.initEntryPoint,
+      timings,
     },
     importErrors,
   },