slicejs-cli 3.0.3 → 3.1.0

package/commands/utils/bundling/BundleGenerator.js

@@ -31,11 +31,22 @@ export default class BundleGenerator {
       maxCriticalSize: 50 * 1024, // 50KB
       maxCriticalComponents: 15,
       minSharedUsage: 3, // Minimum routes to be considered "shared"
+      minVendorSharedUsage: 2,
+      minVendorSharedTransformedSize: 2 * 1024,
       maxRouteBundleSize: 120 * 1024,
       maxRouteRequests: 12,
       strategy: 'hybrid' // 'global', 'hybrid', 'per-route'
     };
 
+    this.vendorShared = {
+      file: 'slice-bundle.vendor-shared.js',
+      dependencyModules: new Map(),
+      dependencyUsage: new Map(),
+      sharedDependencySet: new Set(),
+      bundleKeysUsingSharedDependencies: new Set(),
+      bundle: null
+    };
+
     this.bundles = {
       critical: {
         components: [],
@@ -710,6 +721,14 @@ export default class BundleGenerator {
   async generateBundleFiles() {
     const files = [];
 
+    await this.prepareVendorSharedDependencies();
+
+    if (this.vendorShared.sharedDependencySet.size > 0) {
+      const vendorSharedFile = await this.createVendorSharedDependencyBundleFile(this.vendorShared.sharedDependencySet);
+      this.vendorShared.bundle = vendorSharedFile;
+      files.push(vendorSharedFile);
+    }
+
     // 1. Critical bundle
     if (this.bundles.critical.components.length > 0) {
       const criticalFile = await this.createBundleFile(
@@ -753,6 +772,148 @@ export default class BundleGenerator {
     return files;
   }
 
+  async prepareVendorSharedDependencies() {
+    const routeDependencyIndex = await this.collectRouteExternalDependencyIndex();
+    const usageIndex = this.indexExternalDependencyUsage(routeDependencyIndex);
+    const sharedDependencySet = this.computeSharedDependencySet(usageIndex);
+
+    this.vendorShared.dependencyUsage = usageIndex;
+    this.vendorShared.sharedDependencySet = sharedDependencySet;
+    this.vendorShared.bundleKeysUsingSharedDependencies = new Set();
+
+    if (sharedDependencySet.size === 0) {
+      return;
+    }
+
+    for (const dependencyName of sharedDependencySet) {
+      const usageEntry = usageIndex.get(dependencyName);
+      for (const bundleKey of usageEntry?.bundleKeys || []) {
+        this.vendorShared.bundleKeysUsingSharedDependencies.add(bundleKey);
+      }
+    }
+
+    for (const bundleKey of this.vendorShared.bundleKeysUsingSharedDependencies) {
+      const bundle = this.bundles.routes[bundleKey];
+      if (!bundle) continue;
+      bundle.dependencies = this.mergeBundleDependencies(bundle.dependencies || [], ['vendor-shared']);
+    }
+  }
+
+  async collectRouteExternalDependencyIndex() {
+    const routeDependencyIndex = {};
+
+    for (const [bundleKey, bundle] of Object.entries(this.bundles.routes)) {
+      routeDependencyIndex[bundleKey] = {};
+      const uniqueComponents = this.dedupeComponentsByName(bundle.components || []);
+
+      for (const comp of uniqueComponents) {
+        const fileBaseName = comp.fileName || comp.name;
+        const jsPath = path.join(comp.path, `${fileBaseName}.js`);
+        if (!await fs.pathExists(jsPath)) continue;
+        const jsContent = await fs.readFile(jsPath, 'utf-8');
+        const dependencies = await this.buildDependencyContents(jsContent, comp.path);
+        for (const [depName, depEntry] of Object.entries(dependencies || {})) {
+          if (!routeDependencyIndex[bundleKey][depName]) {
+            routeDependencyIndex[bundleKey][depName] = depEntry;
+          }
+          if (!this.vendorShared.dependencyModules.has(depName)) {
+            this.vendorShared.dependencyModules.set(depName, {
+              name: depName,
+              content: depEntry?.content || ''
+            });
+          }
+        }
+      }
+    }
+
+    return routeDependencyIndex;
+  }
+
+  indexExternalDependencyUsage(routeDependencyIndex = {}) {
+    const usage = new Map();
+
+    for (const [bundleKey, dependencies] of Object.entries(routeDependencyIndex || {})) {
+      for (const [dependencyName, dependencyEntry] of Object.entries(dependencies || {})) {
+        if (!usage.has(dependencyName)) {
+          usage.set(dependencyName, {
+            name: dependencyName,
+            bundleKeys: new Set(),
+            bundleCount: 0,
+            content: dependencyEntry?.content || ''
+          });
+        }
+        const entry = usage.get(dependencyName);
+        entry.bundleKeys.add(bundleKey);
+        entry.bundleCount = entry.bundleKeys.size;
+      }
+    }
+
+    return usage;
+  }
+
+  computeSharedDependencySet(usageIndex = new Map()) {
+    const shared = new Set();
+
+    for (const [dependencyName, entry] of usageIndex.entries()) {
+      if ((entry?.bundleCount || 0) < this.config.minVendorSharedUsage) continue;
+      const transformedContent = this.transformDependencyContent(
+        entry?.content || '',
+        '__sliceVendorSharedProbe',
+        dependencyName
+      );
+      const transformedSize = Buffer.byteLength(transformedContent, 'utf-8');
+      if (transformedSize < this.config.minVendorSharedTransformedSize) continue;
+      shared.add(dependencyName);
+    }
+
+    return shared;
+  }
+
+  generateVendorSharedDependencyBundleContent(sharedDependencySet = new Set()) {
+    const selectedModules = Array.from(sharedDependencySet)
+      .sort((a, b) => a.localeCompare(b))
+      .map((dependencyName) => {
+        const fromUsage = this.vendorShared.dependencyUsage.get(dependencyName)?.content;
+        const fromCollected = this.vendorShared.dependencyModules.get(dependencyName)?.content;
+        const content = fromUsage || fromCollected || '';
+        return { name: dependencyName, content };
+      })
+      .filter((entry) => !!entry.content);
+
+    const dependencyModuleBlock = this.buildV2DependencyModuleBlockFromModules(selectedModules);
+    const metadata = {
+      version: '2',
+      bundleKey: 'vendor-shared',
+      type: 'vendor-shared',
+      routes: [],
+      componentCount: 0,
+      dependencyCount: selectedModules.length
+    };
+
+    return `export const SLICE_BUNDLE_META = ${JSON.stringify(metadata, null, 2)};\n\n${dependencyModuleBlock}\n\nexport async function registerAll() {\n  return SLICE_BUNDLE_DEPENDENCIES;\n}\n`;
+  }
+
+  async createVendorSharedDependencyBundleFile(sharedDependencySet) {
+    const fileName = this.vendorShared.file;
+    const filePath = path.join(this.bundlesPath, fileName);
+    const bundleContent = this.generateVendorSharedDependencyBundleContent(sharedDependencySet);
+    const finalContent = await this.applyBundleTransforms(bundleContent, fileName);
+    await fs.ensureDir(path.dirname(filePath));
+    await fs.writeFile(filePath, finalContent, 'utf-8');
+
+    const hash = crypto.createHash('sha256').update(finalContent).digest('hex');
+
+    return {
+      name: 'vendor-shared',
+      file: fileName,
+      path: filePath,
+      size: Buffer.byteLength(bundleContent, 'utf-8'),
+      hash,
+      integrity: `sha256:${hash}`,
+      componentCount: 0
+    };
+  }
+
   /**
    * Creates a bundle file
    */
@@ -992,7 +1153,11 @@ export default class BundleGenerator {
         : this.routeToFileName(routePath || fileName.replace('slice-bundle.', '').replace('.js', ''));
 
     const dependencyModules = this.collectDependencyModulesFromComponents(uniqueComponents);
-    const dependencyModuleBlock = this.buildV2DependencyModuleBlock(uniqueComponents);
+    const isRouteBundle = type === 'route';
+    const dependencyModuleBlock = this.buildV2DependencyModuleBlock(uniqueComponents, {
+      includeSharedResolver: isRouteBundle,
+      omittedDependencies: isRouteBundle ? this.vendorShared.sharedDependencySet : null
+    });
     const rawHoistedImports = uniqueComponents
       .flatMap((component) => component.hoistedImports || [])
       .map((statement) => String(statement).trim())
@@ -1011,7 +1176,9 @@ export default class BundleGenerator {
     const classFactoryDefinitions = uniqueComponents
       .map((component) => {
         const factoryName = this.classFactoryName(component.name);
-        const dependencyBindings = this.buildDependencyBindings(component.externalDependencies || {});
+        const dependencyBindings = this.buildDependencyBindings(component.externalDependencies || {}, {
+          preferShared: isRouteBundle
+        });
         const body = component.js && component.js.trim()
           ? component.js
           : `return window.${component.name};`;
@@ -1073,11 +1240,25 @@ export default class BundleGenerator {
     return `${hoistedImportBlock}${hoistedImportBlock ? '\n\n' : ''}export const SLICE_BUNDLE_META = ${JSON.stringify(metadata, null, 2)};\n\n${dependencyModuleBlock}\n\n${classFactoryDefinitions}\n\n${templateDeclarations}\n\nexport async function registerAll(controller, stylesManager) {\n${classRegistrations}\n${templateRegistrations}\n${cssRegistrationInit}${cssRegistrationInit ? '\n' : ''}${cssRegistrations}\n${categoryRegistrations}\n}\n`;
   }
 
-  buildV2DependencyModuleBlock(components) {
+  buildV2DependencyModuleBlock(components, options = {}) {
     const modules = this.collectDependencyModulesFromComponents(components);
+    return this.buildV2DependencyModuleBlockFromModules(modules, options);
+  }
 
-    const lines = ['const SLICE_BUNDLE_DEPENDENCIES = {};'];
-    modules.forEach((module, index) => {
+  buildV2DependencyModuleBlockFromModules(modules = [], options = {}) {
+    const omittedDependencies = options.omittedDependencies instanceof Set
+      ? options.omittedDependencies
+      : new Set(options.omittedDependencies || []);
+    const filteredModules = modules.filter((module) => !omittedDependencies.has(module.name));
+
+    const lines = [
+      'const SLICE_BUNDLE_DEPENDENCIES = {};',
+      ...this.getDefaultExportResolverLines()
+    ];
+    if (options.includeSharedResolver) {
+      lines.push(...this.getBundleDependencyResolverLines());
+    }
+    filteredModules.forEach((module, index) => {
       const exportVar = `__sliceDepExports${index}`;
       const transformedContent = this.transformDependencyContent(module.content, exportVar, module.name);
       lines.push(`const ${exportVar} = {};`);
@@ -1237,11 +1418,14 @@ if (window.slice && window.slice.controller) {
 
   buildDependencyModuleBlock(componentsData) {
     const dependencyModules = this.collectDependencyModules(componentsData);
+    const lines = [
+      'const SLICE_BUNDLE_DEPENDENCIES = {};',
+      ...this.getDefaultExportResolverLines()
+    ];
     if (dependencyModules.length === 0) {
-      return 'const SLICE_BUNDLE_DEPENDENCIES = {};';
+      return `${lines.join('\n')}`;
     }
 
-    const lines = ['const SLICE_BUNDLE_DEPENDENCIES = {};'];
     dependencyModules.forEach((module, index) => {
       const exportVar = `__sliceDepExports${index}`;
       const content = this.transformDependencyContent(module.content, exportVar, module.name);
@@ -1285,8 +1469,7 @@ if (window.slice && window.slice.controller) {
   }
 
   transformDependencyContent(content, exportVar, moduleName) {
-    const baseName = moduleName.split('/').pop().replace(/\.[^.]+$/, '');
-    const dataName = baseName ? `${baseName}Data` : null;
+    const dataName = this.getDependencyDefaultFallbackKey(moduleName);
     const exportPrefix = dataName ? `${exportVar}.${dataName} = ` : `${exportVar}.default = `;
 
     return content
@@ -1308,6 +1491,11 @@ if (window.slice && window.slice.controller) {
       .replace(/^\s*export\s+/gm, '');
   }
 
+  getDependencyDefaultFallbackKey(moduleName) {
+    const baseName = moduleName?.split('/').pop()?.replace(/\.[^.]+$/, '');
+    return baseName ? `${baseName}Data` : null;
+  }
+
   buildComponentBundleBlock(componentsData) {
     const componentEntries = [];
     const componentDefs = [];
@@ -1344,19 +1532,19 @@ if (window.slice && window.slice.controller) {
     return `${componentDefs.join('\n\n')}\n\nconst SLICE_BUNDLE_COMPONENTS = {\n${componentEntries.join(',\n')}\n};\n${frameworkBlock}`;
   }
 
-  buildDependencyBindings(externalDependencies) {
+  buildDependencyBindings(externalDependencies, options = {}) {
     const lines = [];
     Object.entries(externalDependencies).forEach(([name, entry]) => {
       const bindings = typeof entry === 'string' ? [] : entry.bindings || [];
-      const depVar = `SLICE_BUNDLE_DEPENDENCIES[${JSON.stringify(name)}]`;
-      const baseName = name.split('/').pop().replace(/\.[^.]+$/, '');
-      const dataName = baseName ? `${baseName}Data` : null;
+      const depVar = options.preferShared
+        ? `__sliceResolveBundleDependency(${JSON.stringify(name)})`
+        : `SLICE_BUNDLE_DEPENDENCIES[${JSON.stringify(name)}]`;
 
       bindings.forEach((binding) => {
         if (!binding?.localName) return;
         if (binding.type === 'default') {
-          const fallback = dataName ? `${depVar}.${dataName}` : `${depVar}.default`;
-          lines.push(`const ${binding.localName} = ${depVar}.default !== undefined ? ${depVar}.default : ${fallback};`);
+          const preferredKey = this.getDependencyDefaultFallbackKey(name);
+          lines.push(`const ${binding.localName} = __sliceResolveDefaultExport(${depVar}, ${JSON.stringify(name)}, ${JSON.stringify(preferredKey)});`);
         }
         if (binding.type === 'named') {
           lines.push(`const ${binding.localName} = ${depVar}.${binding.importedName};`);
@@ -1370,6 +1558,41 @@ if (window.slice && window.slice.controller) {
     return lines.join('\n');
   }
 
+  getBundleDependencyResolverLines() {
+    return [
+      "const __sliceSharedDeps = typeof window !== 'undefined' ? (window.__SLICE_SHARED_DEPS__ || {}) : {};",
+      'const __sliceResolveBundleDependency = (depName) => Object.prototype.hasOwnProperty.call(__sliceSharedDeps, depName) ? __sliceSharedDeps[depName] : SLICE_BUNDLE_DEPENDENCIES[depName];'
+    ];
+  }
+
+  getDefaultExportResolverLines() {
+    return [
+      'const __sliceDefaultExportWarningDeps = new Set();',
+      "const __sliceDefaultExportPreferredKeys = ['module', 'exports', 'purify'];",
+      'const __sliceDeterministicKeyCompare = (a, b) => (a < b ? -1 : a > b ? 1 : 0);',
+      'function __sliceResolveDefaultExport(dep, depName, preferredKey) {',
+      '  if (dep?.default !== undefined) return dep.default;',
+      "  if (dep === null || (typeof dep !== 'object' && typeof dep !== 'function')) return dep;",
+      "  if (preferredKey && preferredKey !== 'default' && preferredKey !== '__esModule' && Object.prototype.hasOwnProperty.call(dep, preferredKey)) return dep[preferredKey];",
+      "  const keys = Object.keys(dep).filter((key) => key !== 'default' && key !== '__esModule');",
+      '  if (keys.length === 1) return dep[keys[0]];',
+      '  if (keys.length > 1) {',
+      '    const preferredMatches = __sliceDefaultExportPreferredKeys.filter((key) => keys.includes(key));',
+      '    if (preferredMatches.length === 1) return dep[preferredMatches[0]];',
+      '    const sortedKeys = [...keys].sort(__sliceDeterministicKeyCompare);',
+      '    const fallbackKey = sortedKeys[0];',
+      '    const warningDepName = depName || "<unknown dependency>";',
+      '    if (!__sliceDefaultExportWarningDeps.has(warningDepName)) {',
+      '      __sliceDefaultExportWarningDeps.add(warningDepName);',
+      '      console.warn(`[Slice.js bundler] Ambiguous default export resolution for "${warningDepName}". Falling back to "${fallbackKey}". Keys: ${sortedKeys.join(\', \')}`);',
+      '    }',
+      '    return dep[fallbackKey];',
+      '  }',
+      '  return dep;',
+      '}'
+    ];
+  }
+
   toSafeIdentifier(name) {
     const cleaned = name.replace(/[^a-zA-Z0-9_]/g, '_');
     if (/^\d/.test(cleaned)) {
@@ -1410,6 +1633,17 @@ if (window.slice && window.slice.controller) {
           integrity: null,
           components: []
         },
+        vendorShared: {
+          bundleKey: 'vendor-shared',
+          type: 'vendor-shared',
+          file: this.vendorShared.file,
+          size: this.vendorShared.bundle?.size || 0,
+          hash: this.vendorShared.bundle?.hash || null,
+          integrity: this.vendorShared.bundle?.integrity || null,
+          dependencies: Array.from(this.vendorShared.sharedDependencySet).sort((a, b) => a.localeCompare(b)),
+          dependencyCount: this.vendorShared.sharedDependencySet.size,
+          routes: Array.from(this.vendorShared.bundleKeysUsingSharedDependencies).sort((a, b) => a.localeCompare(b))
+        },
         critical: {
           file: this.bundles.critical.file,
           size: this.bundles.critical.size,
@@ -1419,14 +1653,20 @@ if (window.slice && window.slice.controller) {
         },
         routes: {}
       },
-      routeBundles: {}
+      routeBundles: {},
+      routeDependencyGraph: {}
     };
 
     for (const [key, bundle] of Object.entries(this.bundles.routes)) {
       const routeIdentifier = Array.isArray(bundle.path || bundle.paths)
         ? key
         : (bundle.path || bundle.paths || key);
-      const dependencies = this.mergeBundleDependencies(bundle.dependencies || []);
+      const usesVendorShared = this.vendorShared.bundleKeysUsingSharedDependencies.has(key)
+        || (bundle.dependencies || []).includes('vendor-shared');
+      const dependencies = this.mergeBundleDependencies(
+        bundle.dependencies || [],
+        usesVendorShared ? ['vendor-shared'] : []
+      );
 
       config.bundles.routes[key] = {
         path: bundle.path || bundle.paths || key, // Support both single path and array of paths, fallback to key
@@ -1454,6 +1694,27 @@ if (window.slice && window.slice.controller) {
         if (!config.routeBundles[routePath].includes(key)) {
           config.routeBundles[routePath].push(key);
         }
+
+        const graphEntry = config.routeDependencyGraph[routePath] || {
+          bundles: [],
+          edges: []
+        };
+        if (!graphEntry.bundles.includes(key)) {
+          graphEntry.bundles.push(key);
+          graphEntry.bundles.sort((a, b) => a.localeCompare(b));
+        }
+
+        const edgeKeys = new Set(graphEntry.edges.map((edge) => `${edge.from}->${edge.to}`));
+        const orderedEdgeSources = ['critical', ...dependencies.filter((dependency) => dependency !== 'critical')];
+        for (const source of orderedEdgeSources) {
+          const edgeKey = `${source}->${key}`;
+          if (!edgeKeys.has(edgeKey)) {
+            graphEntry.edges.push({ from: source, to: key });
+            edgeKeys.add(edgeKey);
+          }
+        }
+
+        config.routeDependencyGraph[routePath] = graphEntry;
       }
     }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "slicejs-cli",
-  "version": "3.0.3",
+  "version": "3.1.0",
   "description": "Command client for developing web applications with Slice.js framework",
   "main": "client.js",
   "bin": {

package/tests/bundle-generator.test.js

@@ -386,3 +386,323 @@ test('formatBundleFile emits hoisted imports for framework-compatible output', (
   assert.match(source, /import boot from '\/public\/bootstrap\.js';/);
   assert.match(source, /const SLICE_BUNDLE_DEPENDENCIES = \{\};/);
 });
+
+test('default dependency binding resolves transformed default key over named exports', () => {
+  const generator = new BundleGenerator(import.meta.url, {
+    components: [],
+    routes: [],
+    metrics: {}
+  });
+
+  const externalDependencies = {
+    'App/purify.js': {
+      content: 'export default () => "DEFAULT"; export const purify = () => "NAMED";',
+      bindings: [{ type: 'default', importedName: 'default', localName: 'purify' }]
+    }
+  };
+
+  const resolverSource = generator.getDefaultExportResolverLines().join('\n');
+  const bindingsSource = generator.buildDependencyBindings(externalDependencies);
+  const resolveBoundValue = new Function(
+    `${resolverSource}\n` +
+    'const SLICE_BUNDLE_DEPENDENCIES = {"App/purify.js": { purifyData: "DEFAULT", purify: "NAMED" }};\n' +
+    `${bindingsSource}\n` +
+    'return purify;'
+  );
+
+  assert.equal(resolveBoundValue(), 'DEFAULT');
+});
+
+const evaluateDefaultResolver = ({ dep, depName = 'App/dep.js', preferredKey = null, calls = 1 }) => {
+  const generator = new BundleGenerator(import.meta.url, {
+    components: [],
+    routes: [],
+    metrics: {}
+  });
+
+  const resolverSource = generator.getDefaultExportResolverLines().join('\n');
+  const resolve = new Function(
+    '__dep',
+    '__depName',
+    '__preferredKey',
+    '__calls',
+    `${resolverSource}\n` +
+      'const __capturedWarnings = [];' +
+      'const __originalWarn = console.warn;' +
+      'console.warn = (...args) => __capturedWarnings.push(args.join(" "));' +
+      'let __result;' +
+      'try {' +
+      '  for (let __i = 0; __i < __calls; __i += 1) {' +
+      '    __result = __sliceResolveDefaultExport(__dep, __depName, __preferredKey);' +
+      '  }' +
+      '} finally {' +
+      '  console.warn = __originalWarn;' +
+      '}' +
+      'return { result: __result, warnings: __capturedWarnings };'
+  );
+
+  return resolve(dep, depName, preferredKey, calls);
+};
+
+test('default resolver returns default when present', () => {
+  const { result, warnings } = evaluateDefaultResolver({
+    dep: { default: 'DEFAULT', alpha: 'ALPHA' }
+  });
+
+  assert.equal(result, 'DEFAULT');
+  assert.equal(warnings.length, 0);
+});
+
+test('default resolver preserves falsy default values', () => {
+  const falsyValues = [0, '', false, null];
+
+  for (const value of falsyValues) {
+    const { result, warnings } = evaluateDefaultResolver({ dep: { default: value, alt: 'fallback' } });
+    assert.equal(result, value);
+    assert.equal(warnings.length, 0);
+  }
+});
+
+test('default resolver falls back to single non-default key', () => {
+  const { result, warnings } = evaluateDefaultResolver({ dep: { onlyKey: 42 } });
+
+  assert.equal(result, 42);
+  assert.equal(warnings.length, 0);
+});
+
+test('default resolver respects preferred key hint when present', () => {
+  const { result, warnings } = evaluateDefaultResolver({
+    dep: { purifyData: 'PREFERRED', purify: 'OTHER' },
+    depName: 'App/purify.js',
+    preferredKey: 'purifyData'
+  });
+
+  assert.equal(result, 'PREFERRED');
+  assert.equal(warnings.length, 0);
+});
+
+test('default resolver prefers known keys module/exports/purify when unambiguous', () => {
+  const moduleResult = evaluateDefaultResolver({ dep: { module: 'MODULE', alpha: 'A' } });
+  const exportsResult = evaluateDefaultResolver({ dep: { exports: 'EXPORTS', beta: 'B' } });
+  const purifyResult = evaluateDefaultResolver({ dep: { purify: 'PURIFY', gamma: 'C' } });
+
+  assert.equal(moduleResult.result, 'MODULE');
+  assert.equal(exportsResult.result, 'EXPORTS');
+  assert.equal(purifyResult.result, 'PURIFY');
+  assert.equal(moduleResult.warnings.length, 0);
+  assert.equal(exportsResult.warnings.length, 0);
+  assert.equal(purifyResult.warnings.length, 0);
+});
+
+test('default resolver uses deterministic alphabetical fallback on ambiguous keys', () => {
+  const { result } = evaluateDefaultResolver({ dep: { zebra: 'Z', alpha: 'A', middle: 'M' } });
+  assert.equal(result, 'A');
+});
+
+test('default resolver source uses locale-independent comparator and named preferred keys constant', () => {
+  const generator = new BundleGenerator(import.meta.url, {
+    components: [],
+    routes: [],
+    metrics: {}
+  });
+
+  const resolverSource = generator.getDefaultExportResolverLines().join('\n');
+
+  assert.match(resolverSource, /const __sliceDefaultExportPreferredKeys = \['module', 'exports', 'purify'\];/);
+  assert.match(resolverSource, /const __sliceDeterministicKeyCompare = \(a, b\) => \(a < b \? -1 : a > b \? 1 : 0\);/);
+  assert.doesNotMatch(resolverSource, /localeCompare/);
+});
+
+test('default resolver warning includes dependency path keys and chosen key', () => {
+  const { warnings } = evaluateDefaultResolver({
+    dep: { zebra: 'Z', alpha: 'A', middle: 'M' },
+    depName: 'App/ambiguous.js'
+  });
+
+  assert.equal(warnings.length, 1);
+  assert.match(warnings[0], /App\/ambiguous\.js/);
+  assert.match(warnings[0], /Falling back to "alpha"/);
+  assert.match(warnings[0], /Keys: alpha, middle, zebra/);
+});
+
+test('default resolver deduplicates ambiguous warning per dependency in one evaluation', () => {
+  const { warnings } = evaluateDefaultResolver({
+    dep: { c: 3, a: 1, b: 2 },
+    depName: 'App/repeat-warning.js',
+    calls: 3
+  });
+
+  assert.equal(warnings.length, 1);
+});
+
+test('default resolver evaluation restores console.warn when resolver throws', () => {
+  const originalWarn = console.warn;
+
+  assert.throws(() => {
+    evaluateDefaultResolver({
+      dep: new Proxy({}, {
+        ownKeys() {
+          throw new Error('kaboom');
+        }
+      })
+    });
+  }, /kaboom/);
+
+  assert.equal(console.warn, originalWarn);
+});
+
+test('default resolver passes through non-object values and null/undefined', () => {
+  const fn = () => 'ok';
+  const functionResult = evaluateDefaultResolver({ dep: fn });
+  const stringResult = evaluateDefaultResolver({ dep: 'value' });
+  const numberResult = evaluateDefaultResolver({ dep: 7 });
+  const nullResult = evaluateDefaultResolver({ dep: null });
+  const undefinedResult = evaluateDefaultResolver({ dep: undefined });
+
+  assert.equal(functionResult.result, fn);
+  assert.equal(stringResult.result, 'value');
+  assert.equal(numberResult.result, 7);
+  assert.equal(nullResult.result, null);
+  assert.equal(undefinedResult.result, undefined);
+});
+
+test('analyzeDependencies resolves extensionless imports across js json and mjs', async () => {
+  const tempRoot = await fs.mkdtemp(path.join(os.tmpdir(), 'slice-deps-ext-'));
+  const componentDir = path.join(tempRoot, 'Component');
+
+  await fs.ensureDir(componentDir);
+  await fs.writeFile(path.join(componentDir, 'dep-js.js'), 'export const value = 1;', 'utf-8');
+  await fs.writeFile(path.join(componentDir, 'dep-json.json'), '{"ok":true}', 'utf-8');
+  await fs.writeFile(path.join(componentDir, 'dep-mjs.mjs'), 'export const ok = true;', 'utf-8');
+
+  const generator = new BundleGenerator(import.meta.url, {
+    components: [],
+    routes: [],
+    metrics: {}
+  });
+
+  try {
+    const jsDeps = generator.analyzeDependencies("import dep from './dep-js';", componentDir);
+    const jsonDeps = generator.analyzeDependencies("import cfg from './dep-json';", componentDir);
+    const mjsDeps = generator.analyzeDependencies("import mod from './dep-mjs';", componentDir);
+
+    assert.equal(jsDeps.length, 1);
+    assert.equal(path.basename(jsDeps[0].path), 'dep-js.js');
+    assert.equal(jsonDeps.length, 1);
+    assert.equal(path.basename(jsonDeps[0].path), 'dep-json.json');
+    assert.equal(mjsDeps.length, 1);
+    assert.equal(path.basename(mjsDeps[0].path), 'dep-mjs.mjs');
+  } finally {
+    await fs.remove(tempRoot);
+  }
+});
+
+test('named and namespace dependency bindings remain unchanged', () => {
+  const generator = new BundleGenerator(import.meta.url, {
+    components: [],
+    routes: [],
+    metrics: {}
+  });
+
+  const externalDependencies = {
+    'App/named.js': {
+      content: 'export const alpha = 1;',
+      bindings: [
+        { type: 'named', importedName: 'alpha', localName: 'localAlpha' },
+        { type: 'namespace', localName: 'namedNamespace' }
+      ]
+    }
+  };
+
+  const resolverSource = generator.getDefaultExportResolverLines().join('\n');
+  const bindingsSource = generator.buildDependencyBindings(externalDependencies);
+  const evaluate = new Function(
+    `${resolverSource}\n` +
+      'const SLICE_BUNDLE_DEPENDENCIES = {"App/named.js": { alpha: 99, other: 1 }};' +
+      `${bindingsSource}\n` +
+      'return { localAlpha, namedNamespace };'
+  );
+
+  const values = evaluate();
+  assert.equal(values.localAlpha, 99);
+  assert.deepEqual(values.namedNamespace, { alpha: 99, other: 1 });
+});
+
+test('indexExternalDependencyUsage tracks unique route-bundle usage counts', () => {
+  const generator = new BundleGenerator(import.meta.url, {
+    components: [],
+    routes: [],
+    metrics: {}
+  });
+
+  const routeDependencyIndex = {
+    alpha: {
+      'deps/shared.js': { content: 'export const shared = true;' },
+      'deps/alpha.js': { content: 'export const alpha = true;' }
+    },
+    beta: {
+      'deps/shared.js': { content: 'export const shared = true;' },
+      'deps/beta.js': { content: 'export const beta = true;' }
+    }
+  };
+
+  const usageIndex = generator.indexExternalDependencyUsage(routeDependencyIndex);
+
+  assert.equal(usageIndex.get('deps/shared.js').bundleCount, 2);
+  assert.equal(usageIndex.get('deps/alpha.js').bundleCount, 1);
+  assert.deepEqual(Array.from(usageIndex.get('deps/shared.js').bundleKeys).sort(), ['alpha', 'beta']);
+});
+
+test('computeSharedDependencySet enforces usage and transformed-size thresholds', () => {
+  const generator = new BundleGenerator(import.meta.url, {
+    components: [],
+    routes: [],
+    metrics: {}
+  });
+
+  const largePayload = 'x'.repeat(2100);
+  const routeDependencyIndex = {
+    alpha: {
+      'deps/shared-large.js': { content: `export const payload = '${largePayload}';` },
+      'deps/shared-small.js': { content: 'export const tiny = 1;' }
+    },
+    beta: {
+      'deps/shared-large.js': { content: `export const payload = '${largePayload}';` },
+      'deps/shared-small.js': { content: 'export const tiny = 1;' }
+    },
+    gamma: {
+      'deps/shared-small.js': { content: 'export const tiny = 1;' }
+    }
+  };
+
+  const usageIndex = generator.indexExternalDependencyUsage(routeDependencyIndex);
+  const sharedSet = generator.computeSharedDependencySet(usageIndex);
+
+  assert.ok(sharedSet.has('deps/shared-large.js'));
+  assert.ok(!sharedSet.has('deps/shared-small.js'));
+});
+
+test('generateVendorSharedDependencyBundleContent emits shared dependency module once', () => {
+  const generator = new BundleGenerator(import.meta.url, {
+    components: [],
+    routes: [],
+    metrics: {}
+  });
+
+  const routeDependencyIndex = {
+    alpha: {
+      'deps/shared.js': { content: `export const payload = '${'y'.repeat(2200)}';` }
+    },
+    beta: {
+      'deps/shared.js': { content: `export const payload = '${'y'.repeat(2200)}';` }
+    }
+  };
+
+  const usageIndex = generator.indexExternalDependencyUsage(routeDependencyIndex);
+  const sharedSet = generator.computeSharedDependencySet(usageIndex);
+  generator.vendorShared.dependencyUsage = usageIndex;
+  const content = generator.generateVendorSharedDependencyBundleContent(sharedSet);
+  const assignmentMatches = content.match(/SLICE_BUNDLE_DEPENDENCIES\["deps\/shared\.js"\]/g) || [];
+
+  assert.equal(assignmentMatches.length, 1);
+});

package/tests/bundle-v2-register-output.test.js

@@ -129,6 +129,10 @@ test('bundle output inlines dependency modules and binds imported symbols in cla
         'App/documentationRoutes.js': {
           content: 'export const documentationRoutes = ["/docs"];',
           bindings: [{ type: 'named', importedName: 'documentationRoutes', localName: 'documentationRoutes' }]
+        },
+        'App/purify.js': {
+          content: 'export const purify = (value) => value;',
+          bindings: [{ type: 'default', importedName: 'default', localName: 'purify' }]
         }
       }
     }],
@@ -136,8 +140,180 @@ test('bundle output inlines dependency modules and binds imported symbols in cla
   );
 
   assert.match(source, /const SLICE_BUNDLE_DEPENDENCIES = \{\};/);
+  assert.match(source, /const __sliceSharedDeps = typeof window !== 'undefined' \? \(window\.__SLICE_SHARED_DEPS__ \|\| \{\}\) : \{\};/);
+  assert.match(source, /function __sliceResolveDefaultExport\(dep, depName, preferredKey\) \{/);
   assert.match(source, /SLICE_BUNDLE_DEPENDENCIES\["App\/documentationRoutes\.js"\] = __sliceDepExports0;/);
-  assert.match(source, /const documentationRoutes = SLICE_BUNDLE_DEPENDENCIES\["App\/documentationRoutes\.js"\]\.documentationRoutes;/);
+  assert.match(source, /const documentationRoutes = __sliceResolveBundleDependency\("App\/documentationRoutes\.js"\)\.documentationRoutes;/);
+  assert.match(source, /const purify = __sliceResolveDefaultExport\(__sliceResolveBundleDependency\("App\/purify\.js"\), "App\/purify\.js", "purifyData"\);/);
+  assert.doesNotMatch(source, /\.default !== undefined \?/);
+  assert.doesNotMatch(source, /SLICE_BUNDLE_DEPENDENCIES\["App\/purify\.js"\]\.purifyData/);
+});
+
+test('route bundle omits extracted vendor-shared modules from inline dependency block and keeps bindings', () => {
+  const generator = new BundleGenerator(import.meta.url, {
+    components: [],
+    routes: [],
+    metrics: {
+      totalComponents: 0,
+      totalRoutes: 0,
+      sharedPercentage: 0,
+      totalSize: 0
+    }
+  }, { output: 'src' });
+
+  generator.vendorShared.sharedDependencySet = new Set(['App/documentationRoutes.js']);
+
+  const source = generator.generateBundleFileContent(
+    'slice-bundle.test.js',
+    'route',
+    [{
+      name: 'DocumentationPage',
+      category: 'AppComponents',
+      categoryType: 'Visual',
+      dependencies: new Set(),
+      size: 100,
+      js: 'class DocumentationPage extends HTMLElement { connectedCallback(){ return [documentationRoutes.length, docsNs.documentationRoutes.length, purify(1)].length; } }\nwindow.DocumentationPage = DocumentationPage;\nreturn DocumentationPage;',
+      html: '',
+      css: '',
+      externalDependencies: {
+        'App/documentationRoutes.js': {
+          content: 'export const documentationRoutes = ["/docs"];',
+          bindings: [
+            { type: 'named', importedName: 'documentationRoutes', localName: 'documentationRoutes' },
+            { type: 'namespace', localName: 'docsNs' }
+          ]
+        },
+        'App/purify.js': {
+          content: 'export default (value) => value;',
+          bindings: [{ type: 'default', importedName: 'default', localName: 'purify' }]
+        }
+      }
+    }],
+    '/docs'
+  );
+
+  assert.match(source, /const __sliceSharedDeps = typeof window !== 'undefined' \? \(window\.__SLICE_SHARED_DEPS__ \|\| \{\}\) : \{\};/);
+  assert.match(source, /const __sliceResolveBundleDependency = \(depName\) => Object\.prototype\.hasOwnProperty\.call\(__sliceSharedDeps, depName\) \? __sliceSharedDeps\[depName\] : SLICE_BUNDLE_DEPENDENCIES\[depName\];/);
+  assert.doesNotMatch(source, /SLICE_BUNDLE_DEPENDENCIES\["App\/documentationRoutes\.js"\] = __sliceDepExports\d+;/);
+  assert.match(source, /SLICE_BUNDLE_DEPENDENCIES\["App\/purify\.js"\] = __sliceDepExports\d+;/);
+  assert.match(source, /const documentationRoutes = __sliceResolveBundleDependency\("App\/documentationRoutes\.js"\)\.documentationRoutes;/);
+  assert.match(source, /const docsNs = __sliceResolveBundleDependency\("App\/documentationRoutes\.js"\);/);
+  assert.match(source, /const purify = __sliceResolveDefaultExport\(__sliceResolveBundleDependency\("App\/purify\.js"\), "App\/purify\.js", "purifyData"\);/);
+});
+
+test('route bundle emits guarded shared deps resolver for non-browser contexts', () => {
+  const generator = new BundleGenerator(import.meta.url, {
+    components: [],
+    routes: [],
+    metrics: {
+      totalComponents: 0,
+      totalRoutes: 0,
+      sharedPercentage: 0,
+      totalSize: 0
+    }
+  }, { output: 'src' });
+
+  const source = generator.generateBundleFileContent(
+    'slice-bundle.test.js',
+    'route',
+    [{
+      name: 'DocsPage',
+      category: 'AppComponents',
+      categoryType: 'Visual',
+      dependencies: new Set(),
+      size: 100,
+      js: 'class DocsPage extends HTMLElement {}\nwindow.DocsPage = DocsPage;\nreturn DocsPage;',
+      html: '',
+      css: '',
+      externalDependencies: {
+        'App/deps.js': {
+          content: 'export const value = 1;',
+          bindings: [{ type: 'named', importedName: 'value', localName: 'value' }]
+        }
+      }
+    }],
+    '/docs'
+  );
+
+  assert.match(source, /const __sliceSharedDeps = typeof window !== 'undefined' \? \(window\.__SLICE_SHARED_DEPS__ \|\| \{\}\) : \{\};/);
+  assert.match(source, /const __sliceResolveBundleDependency = \(depName\) => Object\.prototype\.hasOwnProperty\.call\(__sliceSharedDeps, depName\) \? __sliceSharedDeps\[depName\] : SLICE_BUNDLE_DEPENDENCIES\[depName\];/);
+});
+
+test('non-route bundle does not emit shared resolver block', () => {
+  const generator = new BundleGenerator(import.meta.url, {
+    components: [],
+    routes: [],
+    metrics: {
+      totalComponents: 0,
+      totalRoutes: 0,
+      sharedPercentage: 0,
+      totalSize: 0
+    }
+  }, { output: 'src' });
+
+  const source = generator.generateBundleFileContent(
+    'slice-bundle.framework.js',
+    'framework',
+    [{
+      name: 'FrameworkComp',
+      category: 'Framework',
+      categoryType: 'Visual',
+      dependencies: new Set(),
+      size: 100,
+      js: 'class FrameworkComp extends HTMLElement {}\nwindow.FrameworkComp = FrameworkComp;\nreturn FrameworkComp;',
+      html: '',
+      css: '',
+      externalDependencies: {
+        'App/frameworkDep.js': {
+          content: 'export const dep = 1;',
+          bindings: [{ type: 'named', importedName: 'dep', localName: 'dep' }]
+        }
+      }
+    }],
+    null
+  );
+
+  assert.doesNotMatch(source, /const __sliceSharedDeps = /);
+  assert.doesNotMatch(source, /const __sliceResolveBundleDependency = /);
+  assert.match(source, /const dep = SLICE_BUNDLE_DEPENDENCIES\["App\/frameworkDep\.js"\]\.dep;/);
+});
+
+test('route bundle keeps local fallback binding when shared map is unavailable', () => {
+  const generator = new BundleGenerator(import.meta.url, {
+    components: [],
+    routes: [],
+    metrics: {
+      totalComponents: 0,
+      totalRoutes: 0,
+      sharedPercentage: 0,
+      totalSize: 0
+    }
+  }, { output: 'src' });
+
+  const source = generator.generateBundleFileContent(
+    'slice-bundle.test.js',
+    'route',
+    [{
+      name: 'FallbackComp',
+      category: 'Visual',
+      categoryType: 'Visual',
+      dependencies: new Set(),
+      size: 100,
+      js: 'class FallbackComp extends HTMLElement {}\nwindow.FallbackComp = FallbackComp;\nreturn FallbackComp;',
+      html: '',
+      css: '',
+      externalDependencies: {
+        'App/local.js': {
+          content: 'export const local = 1;',
+          bindings: [{ type: 'named', importedName: 'local', localName: 'local' }]
+        }
+      }
+    }],
+    '/fallback'
+  );
+
+  assert.match(source, /const __sliceResolveBundleDependency = \(depName\) => Object\.prototype\.hasOwnProperty\.call\(__sliceSharedDeps, depName\) \? __sliceSharedDeps\[depName\] : SLICE_BUNDLE_DEPENDENCIES\[depName\];/);
+  assert.match(source, /const local = __sliceResolveBundleDependency\("App\/local\.js"\)\.local;/);
 });
 
 test('bundle output hoists allowed absolute imports to module top-level', () => {
@@ -249,3 +425,46 @@ test('generateBundleFileContent throws on reserved identifier collision', () =>
     );
   }, /reserved identifier collision: SLICE_BUNDLE_META/);
 });
+
+test('generateBundleConfig emits vendor-shared metadata and route dependency graph edges', () => {
+  const generator = new BundleGenerator(import.meta.url, {
+    components: [],
+    routes: [],
+    metrics: {
+      totalComponents: 0,
+      totalRoutes: 1,
+      sharedPercentage: 0,
+      totalSize: 0
+    }
+  }, { output: 'src' });
+
+  generator.bundles.routes = {
+    docs: {
+      path: '/docs',
+      components: [{ name: 'DocumentationPage' }],
+      size: 100,
+      file: 'slice-bundle.docs.js'
+    }
+  };
+
+  generator.vendorShared.sharedDependencySet = new Set(['App/documentationRoutes.js']);
+  generator.vendorShared.bundleKeysUsingSharedDependencies = new Set(['docs']);
+  generator.vendorShared.bundle = {
+    file: 'slice-bundle.vendor-shared.js',
+    size: 2048,
+    hash: 'deadbeef',
+    integrity: 'sha256:deadbeef'
+  };
+
+  const config = generator.generateBundleConfig(null);
+
+  assert.equal(config.bundles.vendorShared.bundleKey, 'vendor-shared');
+  assert.equal(config.bundles.vendorShared.type, 'vendor-shared');
+  assert.equal(config.bundles.vendorShared.dependencyCount, 1);
+  assert.deepEqual(config.bundles.routes.docs.dependencies, ['critical', 'vendor-shared']);
+  assert.deepEqual(config.routeBundles['/docs'], ['critical', 'vendor-shared', 'docs']);
+  assert.deepEqual(config.routeDependencyGraph['/docs'].edges, [
+    { from: 'critical', to: 'docs' },
+    { from: 'vendor-shared', to: 'docs' }
+  ]);
+});