Skip to content

Faster startup#7010

Draft
gonzaloriestra wants to merge 33 commits intomainfrom
faster-startup
Draft

Faster startup#7010
gonzaloriestra wants to merge 33 commits intomainfrom
faster-startup

Conversation

@gonzaloriestra
Copy link
Contributor

@gonzaloriestra gonzaloriestra commented Mar 13, 2026

WHY are these changes introduced?

The CLI requires too much time to start working, it feels slow

WHAT is this pull request doing?

Reduces CLI startup time from 610ms to 160ms (74% faster)

  • Lazy architecture: separate bootstrap.ts from index.ts so all 106 commands aren't loaded upfront; command registry loads only the needed command
  • Deferred hooks: init/prerun/postrun hooks run fire-and-forget after command execution; process.exit(0) avoids waiting for analytics/network
  • Bundle slimming: externalize TypeScript compiler (9.5MB → 614KB), full esbuild minification (694KB → 352KB), V8 compile cache via module.enableCompileCache()
  • Import graph cleanup: custom lightweight dispatcher bypasses oclif.run(), native Node.js builtins replace cli-kit wrappers in the loader, lazy imports for heavy modules (ui.js, error-handler) in base-command
  • Type-only and static imports to prevent accidental runtime deps and eliminate async hops

How to test your changes?

  • shopify version / shopify help return correct output faster
  • shopify app dev and other commands work (hooks fire in background)

Measuring impact

How do we know this change was effective? Please choose one:

  • n/a - this doesn't need measurement, e.g. a linting rule or a bug-fix
  • Existing analytics will cater for this addition
  • PR includes analytics changes to measure impact

Checklist

  • I've considered possible cross-platform impacts (Mac, Linux, Windows)
  • I've considered possible documentation changes

…Result: {"status":"keep","total_ms":1840,"import_ms":1494}
…e hooks to individual files, lazy command registry. 1840ms → 710ms (61% faster)\n\nResult: {"status":"keep","total_ms":710,"import_ms":0}
… skip hydrogen module for non-hydrogen commands. 710ms → 530ms (25% faster)\n\nResult: {"status":"keep","total_ms":530,"import_ms":0}
…imports. Honest measurement with all hooks: 1840ms → 950ms (48% faster)\n\nResult: {"status":"keep","total_ms":950,"import_ms":0}
…me.\n\nResult: {"status":"keep","total_ms":600,"user_ms":420}
…happy path. 600ms → 560ms wall, 420ms → 410ms user.\n\nResult: {"status":"keep","total_ms":560,"user_ms":410}
…kage-manager, analytics, notifications. 560ms → 530ms wall, 410ms → 400ms user.\n\nResult: {"status":"keep","total_ms":530,"user_ms":400}
…s on startup. 530ms → 540ms wall (noise), 400ms → 380ms user (-5%).\n\nResult: {"status":"keep","total_ms":540,"user_ms":380}
…imizations: lazy bootstrap, deferred error-handler, lazy prerun hooks, lazy latest-version.\n\nResult: {"status":"keep","total_ms":610,"user_ms":430}
…ytics in background while command runs. 610ms → 570ms wall (-6.6%), 430ms → 410ms user.\n\nResult: {"status":"keep","total_ms":570,"user_ms":410}
…aiting for analytics/version check network calls. 570ms → 250ms (-56%). Wall = user (no network wait).\n\nResult: {"status":"keep","total_ms":250,"user_ms":250}
… TS compiler (~9MB) for tsconfig parsing. Making it external shrinks startup chunks from 9.5MB to 614KB (93% smaller). 250ms → 220ms.\n\nResult: {"status":"keep","total_ms":220,"user_ms":230}
… needed for lightweight commands). 220ms → 200ms (-9%). Eliminates ~20ms of hook module loading overhead.\n\nResult: {"status":"keep","total_ms":200,"user_ms":210}
…t LocalStorage and hydrogen-init for lightweight commands. 200ms → 190ms (-5%).\n\nResult: {"status":"keep","total_ms":190,"user_ms":210}
…, bypass oclif entirely. 190ms → 60ms (-68%). Total improvement from baseline: 610ms → 60ms (10.2x faster).\n\nResult: {"status":"keep","total_ms":60,"user_ms":40}
…only universal optimizations: lazy bootstrap, lazy commands, lazy hooks, deferred error-handler, TS external, process.exit(0). 610ms → 260ms (-57%) for all commands.\n\nResult: {"status":"keep","total_ms":260,"user_ms":250}
…t hooks (app-init LocalStorage, hydrogen-init) run in background. Universal optimization. 260ms → 230ms (-11.5%).\n\nResult: {"status":"keep","total_ms":230,"user_ms":230}
…th native Node.js builtins in custom-oclif-loader. Eliminates 8 extra chunks (~552KB) from startup path. 230ms → 220ms. Universal.\n\nResult: {"status":"keep","total_ms":220,"user_ms":230}
…ext/local.js chain. Consistent 220ms. Universal.\n\nResult: {"status":"keep","total_ms":220,"user_ms":230}
…t chain). Command gets exclusive CPU time. process.exit(0) kills hooks. Universal. 220ms → 190ms (-14%).\n\nResult: {"status":"keep","total_ms":190,"user_ms":200}
…. Startup chunks 694KB → 352KB (-49%). Wall time ~190ms (marginal improvement, within noise). Universal.\n\nResult: {"status":"keep","total_ms":190,"user_ms":190}
….js. Caches bytecode between runs, eliminating ~40ms V8 compile overhead. Dynamic import bootstrap.js after cache enabled. 190ms → 160ms (-16%). Universal.\n\nResult: {"status":"keep","total_ms":160,"user_ms":160}
…ndler.js, notifications-system.js to point of use. Not captured by help benchmark but reduces startup for ALL actual commands. 160ms (unchanged for help).\n\nResult: {"status":"keep","total_ms":160,"user_ms":160}
…s. Inlines normalizeArgv for space-separated topics. Falls back to oclif only for help/unknown. Avoids loading oclif help module (~50ms) for all actual commands. Help benchmark: 160ms (same). Version: 180ms→150ms.\n\nResult: {"status":"keep","total_ms":160,"user_ms":160}
… environments.js in base-command. Version command new chunks: 972KB→111KB (-88%). Help benchmark 160ms (unchanged). Improves cold-cache startup for all commands.\n\nResult: {"status":"keep","total_ms":160,"user_ms":160}
…k). Minor cleanup. 160ms (unchanged, as expected — async call overhead is negligible).\n\nResult: {"status":"keep","total_ms":160,"user_ms":160}
…minates one async import hop. Startup chunks unchanged (12, 355KB). 160ms. Cleaner code path.\n\nResult: {"status":"keep","total_ms":160,"user_ms":160}
…import of settings. Eliminates async hop on critical path since @oclif/core is already loaded via ShopifyConfig. 160ms (stable). Raw timing shows 140-150ms after warm cache.\n\nResult: {"status":"keep","total_ms":160,"user_ms":160}
…s accidental runtime deps on node-package-manager.js and ui.js. Correctness improvement; 160ms (unchanged - esbuild already tree-shakes).\n\nResult: {"status":"keep","total_ms":160,"user_ms":160}
…rserOutput, FlagInput, OutputArgs. Prevents accidental runtime deps on json.js and @oclif/core/parser. 160ms (unchanged).\n\nResult: {"status":"keep","total_ms":160,"user_ms":160}
@gonzaloriestra
Copy link
Contributor Author

/snapit

Copy link
Contributor Author

gonzaloriestra commented Mar 13, 2026

This stack of pull requests is managed by Graphite. Learn more about stacking.

@github-actions

This comment was marked as outdated.

@github-actions
Copy link
Contributor

github-actions bot commented Mar 13, 2026

Coverage report

St.
Category Percentage Covered / Total
🟡 Statements 76.72% 14625/19062
🟡 Branches 70.38% 7260/10316
🟡 Functions 75.74% 3713/4902
🟡 Lines 78.2% 13825/17678

Test suite run success

3806 tests passing in 1462 suites.

Report generated by 🧪jest coverage report action from 0b00a10

@gonzaloriestra
Copy link
Contributor Author

/snapit

@github-actions
Copy link
Contributor

🫰✨ Thanks @gonzaloriestra! Your snapshot has been published to npm.

Test the snapshot by installing your package globally:

npm i -g --@shopify:registry=https://registry.npmjs.org @shopify/cli@0.0.0-snapshot-20260313155002

Caution

After installing, validate the version by running shopify version in your terminal.
If the versions don't match, you might have multiple global instances installed.
Use which shopify to find out which one you are running and uninstall it.

@github-actions
Copy link
Contributor

Differences in type declarations

We detected differences in the type declarations generated by Typescript for this branch compared to the baseline ('main' branch). Please, review them to ensure they are backward-compatible. Here are some important things to keep in mind:

  • Some seemingly private modules might be re-exported through public modules.
  • If the branch is behind main you might see odd diffs, rebase main into this branch.

New type declarations

packages/cli-kit/dist/private/node/ui/components/token-utils.d.ts
/**
 * Lightweight token types and string utilities.
 * This module does NOT import React or Ink — it can be loaded cheaply.
 * The React component (TokenizedText) remains in TokenizedText.tsx and re-exports from here.
 */
export interface LinkToken {
    link: {
        label?: string;
        url: string;
    };
}
export interface UserInputToken {
    userInput: string;
}
export interface ListToken {
    list: {
        title?: TokenItem<InlineToken>;
        items: TokenItem<InlineToken>[];
        ordered?: boolean;
    };
}
export interface BoldToken {
    bold: string;
}
export type Token = string | {
    command: string;
} | LinkToken | {
    char: string;
} | UserInputToken | {
    subdued: string;
} | {
    filePath: string;
} | ListToken | BoldToken | {
    info: string;
} | {
    warn: string;
} | {
    error: string;
};
export type InlineToken = Exclude<Token, ListToken>;
export type TokenItem<T extends Token = Token> = T | T[];
export declare function tokenItemToString(token: TokenItem): string;
export declare function appendToTokenItem(token: TokenItem, suffix: string): TokenItem;

Existing type declarations

packages/cli-kit/dist/public/common/string.d.ts
@@ -1,4 +1,4 @@
-import { Token, TokenItem } from '../../private/node/ui/components/TokenizedText.js';
+import { Token, TokenItem } from '../../private/node/ui/components/token-utils.js';
 export type RandomNameFamily = 'business' | 'creative';
 /**
  * Generates a random name by combining an adjective and noun.
packages/cli-kit/dist/public/node/base-command.d.ts
@@ -1,5 +1,5 @@
 import { Command } from '@oclif/core';
-import { OutputFlags, Input, ParserOutput, FlagInput, OutputArgs } from '@oclif/core/parser';
+import type { OutputFlags, Input, ParserOutput, FlagInput, OutputArgs } from '@oclif/core/parser';
 export type ArgOutput = OutputArgs<any>;
 export type FlagOutput = OutputFlags<any>;
 declare abstract class BaseCommand extends Command {
packages/cli-kit/dist/public/node/cli-launcher.d.ts
@@ -1,12 +1,16 @@
+import type { LazyCommandLoader } from './custom-oclif-loader.js';
 interface Options {
     moduleURL: string;
     argv?: string[];
+    lazyCommandLoader?: LazyCommandLoader;
 }
 /**
  * Launches the CLI through our custom OCLIF loader.
+ * Uses a lightweight dispatcher that avoids loading oclif's help module
+ * unless help is actually requested. This saves ~50ms for non-help commands.
  *
- * @param options - Options.
- * @returns A promise that resolves when the CLI has been launched.
+ * @param options - Launch options including moduleURL and optional lazy command loader.
+ * @returns A promise that resolves when the CLI has completed.
  */
 export declare function launchCLI(options: Options): Promise<void>;
 export {};
\ No newline at end of file
packages/cli-kit/dist/public/node/cli.d.ts
@@ -1,3 +1,4 @@
+import type { LazyCommandLoader } from './custom-oclif-loader.js';
 /**
  * IMPORTANT NOTE: Imports in this module are dynamic to ensure that "setupEnvironmentVariables" can dynamically
  * set the DEBUG environment variable before the 'debug' package sets up its configuration when modules
@@ -7,6 +8,8 @@ interface RunCLIOptions {
     /** The value of import.meta.url of the CLI executable module */
     moduleURL: string;
     development: boolean;
+    /** Optional lazy command loader for on-demand command loading */
+    lazyCommandLoader?: LazyCommandLoader;
 }
 /**
  * A function that abstracts away setting up the environment and running
@@ -17,6 +20,7 @@ export declare function runCLI(options: RunCLIOptions & {
     runInCreateMode?: boolean;
 }, launchCLI?: (options: {
     moduleURL: string;
+    lazyCommandLoader?: LazyCommandLoader;
 }) => Promise<void>, argv?: string[], env?: NodeJS.ProcessEnv, versions?: NodeJS.ProcessVersions): Promise<void>;
 /**
  * A function for create-x CLIs that automatically runs the "init" command.
@@ -38,5 +42,5 @@ export declare const jsonFlag: {
 /**
  * Clear the CLI cache, used to store some API responses and handle notifications status
  */
-export declare function clearCache(): void;
+export declare function clearCache(): Promise<void>;
 export {};
\ No newline at end of file
packages/cli-kit/dist/public/node/custom-oclif-loader.d.ts
@@ -1,6 +1,43 @@
 import { Command, Config } from '@oclif/core';
 import { Options } from '@oclif/core/interfaces';
+/**
+ * Optional lazy command loader function.
+ * If set, ShopifyConfig will use it to load individual commands on demand
+ * instead of importing the entire COMMANDS module (which triggers loading all packages).
+ */
+export type LazyCommandLoader = (id: string) => Promise<typeof Command | undefined>;
 export declare class ShopifyConfig extends Config {
+    private lazyCommandLoader?;
     constructor(options: Options);
+    /**
+     * Set a lazy command loader that will be used to load individual command classes on demand,
+     * bypassing the default oclif behavior of importing the entire COMMANDS module.
+     *
+     * @param loader - The lazy command loader function.
+     */
+    setLazyCommandLoader(loader: LazyCommandLoader): void;
+    /**
+     * Override runHook to make init hooks non-blocking for faster startup.
+     * Init hooks (app-init, hydrogen-init) set up LocalStorage and check hydrogen —
+     * these are setup tasks that don't need to complete before commands run.
+     *
+     * @param event - The hook event name.
+     * @param opts - Options to pass to the hook.
+     * @param timeout - Optional timeout for the hook.
+     * @param captureErrors - Whether to capture errors instead of throwing.
+     * @returns The hook result with successes and failures arrays.
+     */
+    runHook(event: string, opts: any, timeout?: number, captureErrors?: boolean): Promise<any>;
+    /**
+     * Override runCommand to use lazy loading when available.
+     * Instead of calling cmd.load() which triggers loading ALL commands via index.js,
+     * we directly import only the needed command module.
+     *
+     * @param id - The command ID to run.
+     * @param argv - The arguments to pass to the command.
+     * @param cachedCommand - An optional cached command loadable.
+     * @returns The command result.
+     */
+    runCommand<T = unknown>(id: string, argv?: string[], cachedCommand?: Command.Loadable | null): Promise<T>;
     customPriority(commands: Command.Loadable[]): Command.Loadable | undefined;
 }
\ No newline at end of file
packages/cli-kit/dist/public/node/error.d.ts
@@ -1,6 +1,6 @@
-import { AlertCustomSection } from './ui.js';
 import { OutputMessage } from './output.js';
-import { InlineToken, TokenItem } from '../../private/node/ui/components/TokenizedText.js';
+import { InlineToken, TokenItem } from '../../private/node/ui/components/token-utils.js';
+import type { AlertCustomSection } from './ui.js';
 export { ExtendableError } from 'ts-error';
 export declare enum FatalErrorType {
     Abort = 0,
packages/cli-kit/dist/public/node/is-global.d.ts
@@ -1,4 +1,4 @@
-import { PackageManager } from './node-package-manager.js';
+import type { PackageManager } from './node-package-manager.js';
 /**
  * Returns true if the current process is running in a global context.
  *
packages/cli-kit/dist/public/node/output.d.ts
@@ -1,8 +1,8 @@
-import { PackageManager } from './node-package-manager.js';
 import { AbortSignal } from './abort.js';
-import { TokenItem } from './ui.js';
 import { ColorContentToken, CommandContentToken, ContentToken, ErrorContentToken, HeadingContentToken, ItalicContentToken, JsonContentToken, LinesDiffContentToken, LinkContentToken, PathContentToken, RawContentToken, SubHeadingContentToken } from '../../private/node/content-tokens.js';
 import { Writable } from 'stream';
+import type { PackageManager } from './node-package-manager.js';
+import type { TokenItem } from '../../private/node/ui/components/token-utils.js';
 import type { Change } from 'diff';
 export type Logger = Writable | ((message: string, logLevel?: LogLevel) => void);
 export declare class TokenizedString {
packages/cli-kit/dist/private/node/ui/utilities.d.ts
@@ -1,16 +1,16 @@
-import { TokenItem } from './components/TokenizedText.js';
-export declare function messageWithPunctuation(message: TokenItem): string | {
+import { TokenItem } from './components/token-utils.js';
+export declare function messageWithPunctuation(message: TokenItem): string | import("./components/token-utils.js").LinkToken | import("./components/token-utils.js").UserInputToken | import("./components/token-utils.js").ListToken | {
     command: string;
-} | import("./components/TokenizedText.js").LinkToken | {
+} | {
     char: string;
-} | import("./components/TokenizedText.js").UserInputToken | {
+} | {
     subdued: string;
 } | {
     filePath: string;
-} | import("./components/TokenizedText.js").ListToken | import("./components/TokenizedText.js").BoldToken | {
+} | import("./components/token-utils.js").BoldToken | {
     info: string;
 } | {
     warn: string;
 } | {
     error: string;
-} | import("./components/TokenizedText.js").Token[];
\ No newline at end of file
+} | import("./components/token-utils.js").Token[];
\ No newline at end of file
packages/cli-kit/dist/public/node/hooks/postrun.d.ts
@@ -1,3 +1,7 @@
+/**
+ * Postrun hook — uses dynamic imports to avoid loading heavy modules (base-command, analytics)
+ * at module evaluation time. These are only needed after the command has already finished.
+ */
 import { Hook } from '@oclif/core';
 /**
  * Check if post run hook has completed.
packages/cli-kit/dist/private/node/ui/components/TokenizedText.d.ts
@@ -1,42 +1,7 @@
 import { FunctionComponent } from 'react';
-export interface LinkToken {
-    link: {
-        label?: string;
-        url: string;
-    };
-}
-export interface UserInputToken {
-    userInput: string;
-}
-export interface ListToken {
-    list: {
-        title?: TokenItem<InlineToken>;
-        items: TokenItem<InlineToken>[];
-        ordered?: boolean;
-    };
-}
-export interface BoldToken {
-    bold: string;
-}
-export type Token = string | {
-    command: string;
-} | LinkToken | {
-    char: string;
-} | UserInputToken | {
-    subdued: string;
-} | {
-    filePath: string;
-} | ListToken | BoldToken | {
-    info: string;
-} | {
-    warn: string;
-} | {
-    error: string;
-};
-export type InlineToken = Exclude<Token, ListToken>;
-export type TokenItem<T extends Token = Token> = T | T[];
-export declare function tokenItemToString(token: TokenItem): string;
-export declare function appendToTokenItem(token: TokenItem, suffix: string): TokenItem;
+import type { TokenItem } from './token-utils.js';
+export type { LinkToken, UserInputToken, ListToken, BoldToken, Token, InlineToken, TokenItem } from './token-utils.js';
+export { tokenItemToString } from './token-utils.js';
 interface TokenizedTextProps {
     item: TokenItem;
 }

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant