Faster startup (1/4): Lazy command loading#7010
Conversation
5dcfe79 to
2e9cb42
Compare
|
/snapit |
This stack of pull requests is managed by Graphite. Learn more about stacking. |
This comment was marked as outdated.
This comment was marked as outdated.
2e9cb42 to
2bcac68
Compare
Coverage report
Test suite run success4000 tests passing in 1531 suites. Report generated by 🧪jest coverage report action from f3f181b |
2bcac68 to
ee19f03
Compare
|
/snapit |
|
🫰✨ 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-20260313155002Caution After installing, validate the version by running |
a818a13 to
62c6045
Compare
89ff167 to
41b8681
Compare
118f6ce to
d5aae16
Compare
0b7096a to
da82414
Compare
da82414 to
6d7630b
Compare
Split the monolithic index.ts (which eagerly imports all 106 commands and their dependency trees) into a lightweight bootstrap.ts entry point and a lazy command-registry.ts. Commands are loaded on-demand via a LazyCommandLoader passed to ShopifyConfig.runCommand(). Hooks are moved to individual files so oclif loads them independently instead of through index.ts. Token utilities extracted from TokenizedText.tsx to break circular import chains. Startup time: 1840ms → 710ms (61% faster)
6d7630b to
f3f181b
Compare
Differences in type declarationsWe 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:
New type declarationspackages/cli-kit/dist/public/node/custom-oclif-loader.d.tsimport { 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 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;
}
Existing type declarationspackages/cli-kit/dist/public/node/cli-launcher.d.ts@@ -1,6 +1,8 @@
+import type { LazyCommandLoader } from './custom-oclif-loader.js';
interface Options {
moduleURL: string;
argv?: string[];
+ lazyCommandLoader?: LazyCommandLoader;
}
/**
* Launches the CLI.
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
|

WHY are these changes introduced?
The CLI requires too much time to start working, it feels slow
WHAT is this pull request doing?
Splits the monolithic
index.ts(which eagerly imports all 106 commands and their dependency trees) into a lightweightbootstrap.tsentry point and a lazycommand-registry.ts. Commands are loaded on-demand via aLazyCommandLoaderpassed toShopifyConfig.runCommand().bootstrap.tssets up global proxy, signal handlers, and callsrunCLI— it does NOT import any command modulescommand-registry.tsmaps command IDs to dynamicimport()expressions, so only the invoked command's module is loadedrunCommandoverride inShopifyConfig: when aLazyCommandLoaderis set,runCommandbypasses oclif's defaultcmd.load()(which would pull in the entireindex.ts) and directly runs the lazily-loaded command classhooks/app-init.ts,hooks/did-you-mean.ts, etc.) so oclif loads them independently instead of throughindex.ts@shopify/appexports hooks via subpath entries (./hooks/public-metadata,./hooks/sensitive-metadata) so they can be imported individuallyerrorHandleris imported lazily in the catch block oflaunchCLI, removing it from the critical startup pathStartup time: 1840ms → 710ms (61% faster)
How to test your changes?
shopify version/shopify helpreturn correct outputshopify app devand other commands work normallyMeasuring impact
Checklist