progress

Author: justinvdm

.worklogs/justin/2025-09-01-dev-server-dependency-optimization.md

@@ -107,3 +107,21 @@ Finally, a guard was added to the plugin's `configResolved` hook to ensure this
 
 The `createDirectiveLookupPlugin` was also updated to ensure its runtime `import()` statements pointed to the new physical dummy barrel files, fully removing the last reference to the old virtual module system.
 
+## 9. A New Hurdle: Inter-Environment Dependency Timing
+
+The "dummy file" solution is correct in principle, but its success depends on a critical assumption: that the `worker` environment completes its dependency scan and populates the `clientFiles` and `serverFiles` sets *before* the `client` and `ssr` environments run their own `optimizeDeps` pass.
+
+It has become clear that this assumption is false. The environment optimizers appear to run in parallel, which means `directiveModulesDevPlugin` (running in the `client` and `ssr` environments) executes with empty `clientFiles` and `serverFiles` sets, rendering the optimization useless.
+
+The next step is to investigate Vite's source code to answer a key question: how does Vite manage the `optimizeDeps` process for multiple environments? We need to determine if they are run concurrently or sequentially, and if there is any mechanism to enforce a specific order. The goal is to find a way to delay the `client` and `ssr` dependency optimization until after the `worker` environment has completed its initial scan.
+
+### 9.1. Investigation Findings: Parallel Execution
+
+A thorough investigation of Vite's source code (`packages/vite/src/node/server/index.ts`) has provided a definitive answer. During server startup, the `initServer` function calls the `listen` method on all configured environments wrapped in a `Promise.all`.
+
+The `listen` method on each `DevEnvironment` instance is responsible for calling `depsOptimizer.init()`, which is the asynchronous function that starts the dependency scanning and optimization process.
+
+Because they are called via `Promise.all`, **all environment dependency optimizers are explicitly run in parallel.** This confirms that our initial assumption was incorrect and explains why the `clientFiles` and `serverFiles` sets are empty. There is no built-in mechanism in Vite to enforce a sequential dependency optimization chain between environments.
+
+Our next task is to devise a new strategy to manually create this synchronization.
+

sdk/src/runtime/imports/ssr.ts

@@ -4,7 +4,6 @@ export const ssrLoadModule = memoizeOnId(async (id: string) => {
   const { useClientLookup } = await import(
     "virtual:use-client-lookup.js" as string
   );
-
   const moduleFn = useClientLookup[id];
 
   if (!moduleFn) {

sdk/src/vite/configPlugin.mts

@@ -7,10 +7,7 @@ import debug from "debug";
 import { readFile, writeFile } from "node:fs/promises";
 import { glob } from "glob";
 
-import {
-  INTERMEDIATE_SSR_BRIDGE_PATH,
-  INTERMEDIATES_OUTPUT_DIR,
-} from "../lib/constants.mjs";
+import { INTERMEDIATE_SSR_BRIDGE_PATH } from "../lib/constants.mjs";
 import { buildApp } from "./buildApp.mjs";
 
 const log = debug("rwsdk:vite:config");

sdk/src/vite/createDirectiveLookupPlugin.mts

@@ -77,56 +77,6 @@ export const findFilesContainingDirective = async ({
     log("Found files for %s: %j", directive, Array.from(files));
 };
 
-const resolveOptimizedDep = async (
-  projectRootDir: string,
-  id: string,
-  environment: string,
-  debugNamespace: string,
-): Promise<string | undefined> => {
-  const log = debug(debugNamespace);
-
-  try {
-    const depsDir = environment === "client" ? "deps" : `deps_${environment}`;
-    const nodeModulesDepsDirPath = path.join("node_modules", ".vite", depsDir);
-    const depsDirPath = path.join(projectRootDir, nodeModulesDepsDirPath);
-    const manifestPath = path.join(depsDirPath, "_metadata.json");
-    log("Checking for manifest at: %s", manifestPath);
-
-    const manifestExists = await pathExists(manifestPath);
-    if (!manifestExists) {
-      log("Manifest not found at %s", manifestPath);
-      return undefined;
-    }
-
-    const manifestContent = await readFile(manifestPath, "utf-8");
-    const manifest = JSON.parse(manifestContent);
-
-    if (manifest.optimized && manifest.optimized[id]) {
-      const optimizedFile = manifest.optimized[id].file;
-      const optimizedPath = path.join(
-        "/",
-        nodeModulesDepsDirPath,
-        optimizedFile,
-      );
-
-      log(
-        "Found optimized dependency: filePath=%s, optimizedPath=%s",
-        id,
-        optimizedPath,
-      );
-      return optimizedPath;
-    }
-
-    process.env.VERBOSE &&
-      log("File not found in optimized dependencies: id=%s", id);
-    return undefined;
-  } catch (error) {
-    process.env.VERBOSE &&
-      log("Error resolving optimized dependency for id=%s: %s", id, error);
-    return undefined;
-  }
-};
-
 export const createDirectiveLookupPlugin = async ({
   projectRootDir,
   files,
@@ -238,8 +188,6 @@ export const createDirectiveLookupPlugin = async ({
       }
     },
     resolveId(source) {
-      process.env.VERBOSE && log("Resolving id=%s", source);
-
       if (source === `${config.virtualModuleName}.js`) {
         log("Resolving %s module", config.virtualModuleName);
         // context(justinvdm, 16 Jun 2025): Include .js extension

sdk/src/vite/directiveModulesDevPlugin.mts

@@ -67,10 +67,11 @@ export const directiveModulesDevPlugin = ({
       log("Created dummy barrel files at:", dummyFilePaths);
 
       // This esbuild plugin hijacks the dummy files
-      const esbuildPlugin = {
+      const esbuildPlugin = (envName: string) => ({
         name: "rwsdk:directive-modules-dev-esbuild",
         setup(build: any) {
           build.onLoad({ filter: /rwsdk-.*-barrel\.js/ }, (args: any) => {
+            console.log("############### onLoad", envName);
             log("ESBuild loading dummy file %s", args.path);
             const isClient = args.path.includes("client");
             const files = isClient ? clientFiles : serverFiles;
@@ -79,7 +80,7 @@ export const directiveModulesDevPlugin = ({
             return { contents, loader: "js" };
           });
         },
-      };
+      });
 
       for (const envName of ["client", "ssr"]) {
         const envConfig = config.environments[envName];
@@ -97,7 +98,9 @@ export const directiveModulesDevPlugin = ({
           // 2. Add esbuild plugin for the dependency optimizer
           envConfig.optimizeDeps.esbuildOptions ??= {};
           envConfig.optimizeDeps.esbuildOptions.plugins ??= [];
-          envConfig.optimizeDeps.esbuildOptions.plugins.push(esbuildPlugin);
+          envConfig.optimizeDeps.esbuildOptions.plugins.push(
+            esbuildPlugin(envName),
+          );
         }
       }
     },

sdk/src/vite/reactConditionsResolverPlugin.mts

@@ -181,14 +181,6 @@ export const reactConditionsResolverPlugin = ({
       name: `rwsdk:react-conditions-resolver-esbuild-${envName}`,
       setup(build: any) {
         build.onResolve({ filter: /.*/ }, (args: any) => {
-          process.env.VERBOSE &&
-            log(
-              "ESBuild resolving %s for env=%s, args=%O",
-              args.path,
-              envName,
-              args,
-            );
-
           let resolved: string | undefined = mappings.get(args.path);
 
           if (!resolved) {
@@ -200,13 +192,6 @@ export const reactConditionsResolverPlugin = ({
           }
 
           if (resolved && args.importer !== "") {
-            process.env.VERBOSE &&
-              log(
-                "ESBuild resolving %s -> %s for env=%s",
-                args.path,
-                resolved,
-                envName,
-              );
             if (args.path === "react-server-dom-webpack/client.edge") {
               return;
             }