@lwrjs/lwc-ssr 0.9.0-alpha.3 → 0.9.0-alpha.30

package/README.md

@@ -1,11 +1,34 @@
 # Server-side rendering (SSR) in LWR
 
+-   [Overview](#overview)
+    -   [What is SSR?](#what-is-ssr)
+    -   [Why use SSR?](#why-use-ssr)
+-   [Using SSR with LWR](#using-ssr-with-lwr)
+    -   [Turn on SSR](#turn-on-ssr)
+    -   [Building SSR pages](#building-ssr-pages)
+    -   [Loading data during SSR](#loading-data-during-ssr)
+    -   [Caching](#caching)
+    -   [Client hydration](#client-hydration)
+-   [Best Practices](#best-practices)
+    -   [SSR execution](#ssr-execution)
+    -   [Portability](#portability)
+    -   [Synchronous code](#synchronous-code)
+-   [Debugging](#debugging)
+    -   [Debug logging]()
+    -   [Breakpoints](#breakpoints)
+    -   [Inspect bundles](#inspect-bundles)
+
 ## Overview
 
 ### What is SSR?
 
 [Lightning Web Components (LWC)](https://lwc.dev/) is a framework for creating client-side applications. However, these components can also be rendered as an HTML string on the **server**. LWR sends these strings to the client, where they can be ["hydrated"](#client-hydration) to create an interactive web app.
 
+See the following RFCs from LWC:
+
+-   [LWC Server Engine](https://rfcs.lwc.dev/rfcs/lwc/0112-server-engine)
+-   [SSR Rehydration](https://rfcs.lwc.dev/rfcs/lwc/0117-ssr-rehydration)
+
 ### Why use SSR?
 
 With SSR, the browser does not need to wait for all the JavaScript to download and execute before displaying component markup. This results in faster time-to-content, especially on slower devices or internet connections. It also makes the content accessible to search engine crawlers, improving SEO.
@@ -18,11 +41,21 @@ Learn how to use SSR in your LWR apps.
 
 ### Turn on SSR
 
-SSR is activated on a per-route basis by changing `bootstrap.ssr` to `true`:
+The SSR `moduleProvider` and `viewTransformer` must be pulled into the app to handle the SSR processing. Then SSR can be activated on a per-route basis by changing `bootstrap.ssr` to `true`.
 
 ```json
 // my-app/lwr.config.json
 {
+    "moduleProviders": [
+        "@lwrjs/app-service/moduleProvider",
+        "@lwrjs/lwc-ssr/moduleProvider", // create modules which perform SSR
+        "@lwrjs/lwc-module-provider",
+        "@lwrjs/npm-module-provider"
+    ],
+    "viewTransformers": [
+        "@lwrjs/base-view-transformer",
+        "@lwrjs/lwc-ssr/viewTransformer" // inserts SSRed HTML into a page document
+    ],
     "routes": [
         {
             "id": "ssr-page",
@@ -39,13 +72,15 @@ SSR is activated on a per-route basis by changing `bootstrap.ssr` to `true`:
 }
 ```
 
+> See an example app which uses SSR in the [LWR recipes repository](https://github.com/salesforce-experience-platform-emu/lwr-recipes/tree/main/packages/ssr).
+
 ### Building SSR pages
 
 When a route with `bootstrap.ssr` is requested, LWR will use [LWC'S `renderComponent()` function](https://rfcs.lwc.dev/rfcs/lwc/0112-server-engine) to SSR each **root component** on the page. This is done whether the page is generated at runtime, or pre-built using `generateStaticSite()`.
 
-> A "root component" is any lwc in an app route's [content template, layout template](https://github.com/salesforce/lwr-recipes/tree/main/packages/templating#templates), or [`rootComponent` configuration](https://github.com/salesforce/lwr-recipes/blob/main/doc/config.md#routes).
+> A "root component" is any lwc in an app route's [content template, layout template](https://github.com/salesforce-experience-platform-emu/lwr-recipes/tree/main/packages/templating#templates), or [`rootComponent` configuration](https://github.com/salesforce-experience-platform-emu/lwr-recipes/blob/main/doc/config.md#routes).
 
-LWR will automatically pass any root component attributes from a [template](https://github.com/salesforce/lwr-recipes/tree/main/packages/templating#templates) as [public properties](https://developer.salesforce.com/docs/component-library/documentation/en/lwc/reactivity_public) during SSR. For example, `my/root` will receive `{ limit: '10' }`.
+LWR will automatically pass any root component attributes from a [template](https://github.com/salesforce-experience-platform-emu/lwr-recipes/tree/main/packages/templating#templates) as [public properties](https://developer.salesforce.com/docs/component-library/documentation/en/lwc/reactivity_public) during SSR. For example, `my/root` will receive `{ limit: '10' }`.
 
 ```html
 <!-- my-app/src/content/page.html -->
@@ -93,6 +128,9 @@ interface PageDataResponse {
             fetchpriority?: 'high' | 'low' | 'auto';
         }[];
     };
+    cache?: {
+        ttl?: string | number; // time-to-live: time string or number of seconds
+    };
 }
 
 type Json = undefined | null | boolean | number | string | Json[] | { [prop: string]: Json };
@@ -102,13 +140,13 @@ In LWR, the SSR process runs in a sandbox. This sandbox supports `globalThis.fet
 
 #### JSON
 
-Data in `PageDataResponse.props` is serialized into the page document as JSON. LWR passes this data to the component as [public properties](<(https://developer.salesforce.com/docs/component-library/documentation/en/lwc/reactivity_public)>) during both SSR and [client hydration](#client-hydration).
+Data in `PageDataResponse.props` is serialized into the page document as JSON for each root component. LWR passes this data to the root component as [public properties](<(https://developer.salesforce.com/docs/component-library/documentation/en/lwc/reactivity_public)>) during both SSR and [client hydration](#client-hydration). In order to receive the properties, the root component must declare them using `@api` (see the `data` property in the [example](#data-example) below).
 
 #### Markup
 
 Data in `PageDataResponse.markup` is serialized into the page document as HTML. LWR adds each `markup.link` returned by `getPageData()` to the `<head>` section of the page document. For example, developers can [preload images](https://developer.chrome.com/blog/link-rel-preload/) to improve a page's performance on the client.
 
-#### Example
+#### Data example
 
 The `getPageData()` hook is exported as a function from a root component module:
 
@@ -147,6 +185,7 @@ export async function getPageData(context: SsrRequestContext): Promise<PageDataR
                 },
             ],
         },
+        cache: { ttl: '60s' },
     };
 }
 ```
@@ -157,22 +196,107 @@ Notes:
 -   The author of `getPageData()` is responsible for validating the `params` and `query` from `SsrRequestContext` before using them.
 -   The **same** `props` returned by `getPageData()` are passed to the component during server rendering **and** client hydration.
 
+### Caching
+
+The `getPageData()` SSR hook can return a time-to-live (TTL) for the page in `PageDataReponse.cache.ttl`. The `ttl` value can be a string (see examples [here](https://www.npmjs.com/package/ms)) or a number of seconds. It will be used to set the `max-age` of the `Cache-control` header on the page document. If the root components on a page return more than one TTL, then the shortest one wins.
+
+There are two other ways to set a TTL on a page document:
+
+1. in a `route` in the LWR app config (see doc [here](https://github.com/salesforce-experience-platform-emu/lwr-recipes/blob/main/doc/config.md#routes))
+2. from the return value of a `RouteHandlerFunction` (see doc [here](https://github.com/salesforce-experience-platform-emu/lwr-recipes/tree/main/packages/templating#route-handler-params))
+
+LWR will use the shortest TTL value from **all** sources to set the `max-age` of the `Cache-control` header on the page.
+
 ### Client hydration
 
 When SSRed component HTML reaches the browser, each root component is automatically hydrated. LWR uses the [LWC `hydrateComponent()` API](https://rfcs.lwc.dev/rfcs/lwc/0117-ssr-rehydration) to do so. Hydrating a component starts its component lifecycle and makes it interactive.
 
-### Debugging
+## Best Practices
+
+### SSR execution
+
+When SSR runs, the LWC framework executes the following functions for a given component:
+
+-   `constructor`
+-   `connectedCallback`
+-   getters
+-   setters
+-   any other functions called by the above
+
+So in order to SSR a component successfully, these functions must be both [portable](#portability) and [synchronous](#synchronous-code).
+
+### Portability
+
+To SSR successfully, a component must be **portable**. Code is portable when it can run in a headless environment (ie: no DOM APIs, see LWC SSR constraints [here](https://rfcs.lwc.dev/rfcs/lwc/0112-server-engine#constraints)). SSRable components are also called **isomorphic**.
+
+Examples of non-portable code and objects include:
+
+-   `window`
+-   `document`
+-   selector functions (`template.querySelector`, `template.querySelectorAll`, ...)
+-   `classList`
+-   JavaScript eventing
+
+Isomorphic components can:
+
+-   place non-portable code in a function which is not [executed during SSR](#ssr-execution), such as the `renderedCallback`.
+-   guard non-portable objects so they are not accessed during SSR:
+
+```js
+// guard usage of the window object so it does not throw during SSR
+export default class App extends LightningElement {
+    connectedCallback() {
+        if (typeof window !== 'undefined') {
+            window.addEventListener('error', (evt) => {
+                console.error(`⚠️ Uncaught error: ${evt.message}`);
+            });
+        }
+    }
+}
+```
+
+### Synchronous code
+
+The LWC SSR process run in a single synchronous pass. So any asynchronous code **will not be SSRed**. Asynchronous code includes:
+
+-   [Promises](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise)
+-   [`async`/`await`](https://www.w3schools.com/js/js_async.asp)
+-   [dynamic imports](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/import)
+
+## Debugging
+
+### Debug logging
+
+See fine-grained logging with the `LOG_LEVEL` flag:
+
+```sh
+LOG_LEVEL=debug MODE=prod-compat yarn start # start up the LWR server, in any mode
+```
+
+### Breakpoints
 
 With the introduction of [@locker/near-membrane-node](https://github.com/salesforce/near-membrane/tree/main/packages/near-membrane-node) sandbox, debugging a module in server side rendering is straightforward:
 
-1. setting a `debugger;` statement in your module
-2. attach node process to the LWR server
+1. Set a `debugger;` statement in a module.
+2. Attach node process to the LWR server.
 
 ```sh
-LOCKER_SB=true yarn lwr:example:debug
+node --inspect-brk scripts/start.js # where start.js creates and starts the LWR server
 ```
 
-3. visit intended url(http://localhost:3000/ssr in this example) with a browser
-4. when `debugger;` statement is executed, VS Code would break with the VM tab showing up
+3. When the `debugger;` statement is executed, VS Code will break using the VM tab.
 
 ![Sandbox Debugging Screenshot](../../../assets/sandbox-debug.png)
+
+> Debugging the LWR sample application (ie: `lwr-example-app`) using `yarn lwr:example:debug`.
+
+### Inspect bundles
+
+When SSR fails due to a [portability](#portability), it can be difficult to figure out which component is causing the issue. The broken component can be found by inspecting the module bundle for the page:
+
+1. Go to the LWR config for the app (ie: _lwr.config.json_), and turn the [`ssr` flag](#turn-on-ssr) on the broken route **off**.
+2. Start the LWR app and load the route in the browser.
+3. Inspect the page's module bundles for the problematic code. Module bundles are served from _/1/bundle/..._.
+4. When the problematic code is found, scroll up to find the component to which it belongs.
+
+For example, if SSR fails with this error:`ReferenceError: window is not defined`, then turn off SSR and search the module bundles for prohibited usages of the `window` object.

package/build/cjs/moduleProvider/index.cjs

@@ -35,20 +35,26 @@ import { renderComponent } from '@lwc/engine-server';
 import Ctor, * as rootComponent from '${rootSpecifier}';
 
 (async () => {
-    // 1. setup page data
-    const context = globalThis.getContext();
-    let props = context.props;
-    let markup;
-    if (rootComponent.getPageData) {
-        const data = await rootComponent.getPageData(context);
-        props = data.props; // overwrite public props
-        markup = data.markup;
-    }
+    let result, props, markup;
+    try {
+        // 1. setup page data
+        const context = globalThis.getContext();
+        props = context.props;
+        if (rootComponent.getPageData) {
+            const data = await rootComponent.getPageData(context);
+            props = data.props; // overwrite public props
+            markup = data.markup;
+        }
+
+        // 2. render component
+        result = renderComponent('${(0, import_shared_utils.moduleSpecifierToKebabCase)(rootSpecifier)}', Ctor, props || {});
 
-    // 2. render component
-    const result = renderComponent('${(0, import_shared_utils.moduleSpecifierToKebabCase)(rootSpecifier)}', Ctor, props || {});
+    } catch(e) {
+        // (3) relay error
+        globalThis.resolver({ error: e.message || e });
+    }
 
-    // 3. relay results
+    // 3. relay successful results
     globalThis.resolver({ result, props, markup });
 })()`;
 }

package/build/cjs/viewTransformer/amd-utils.cjs

@@ -24,10 +24,12 @@ var __toModule = (module2) => {
 // packages/@lwrjs/lwc-ssr/src/viewTransformer/amd-utils.ts
 __markAsModule(exports);
 __export(exports, {
-  default: () => getCode
+  getBundle: () => getBundle,
+  getCode: () => getCode
 });
-var import_loader = __toModule(require("@lwrjs/loader"));
 var import_shared_utils = __toModule(require("@lwrjs/shared-utils"));
+var import_identity = __toModule(require("../identity.cjs"));
+var lwcEngineSpecifier = "@lwc/engine-server";
 async function readableToString(readable) {
   let result = "";
   for await (const chunk of readable) {
@@ -36,20 +38,16 @@ async function readableToString(readable) {
   return result;
 }
 var loaderShimSource;
-async function getLoaderShim(runtimeEnvironment) {
+async function getLoaderShim(resourceRegistry, runtimeEnvironment) {
   if (loaderShimSource !== void 0) {
     return loaderShimSource;
   }
-  const amdloaderShimService = new import_loader.default({}, {
-    runtimeEnvironment,
-    resourceRegistry: {resolveResourceUri: () => "NOT IMPLEMENTED"}
-  });
-  const specifier = (0, import_shared_utils.getFeatureFlags)().LEGACY_LOADER ? "lwr-loader-shim-legacy.bundle.js" : "lwr-loader-shim.bundle.js";
-  const resource = await amdloaderShimService.getResource({specifier}, runtimeEnvironment);
+  const specifier = (0, import_shared_utils.getFeatureFlags)().LEGACY_LOADER ? "lwr-loader-shim-legacy.bundle.min.js" : "lwr-loader-shim.bundle.min.js";
+  const resource = await resourceRegistry.getResource({specifier}, runtimeEnvironment);
   if (resource) {
     const {stream} = resource;
     if (stream) {
-      loaderShimSource = await readableToString(stream);
+      loaderShimSource = await readableToString(stream());
       return loaderShimSource;
     }
   }
@@ -73,18 +71,18 @@ function getLwrConfig(bundleSpecifier, lwrVersion) {
   });
 }
 function lwcDefineOverride(lwcSpecifier) {
-  return `LWR.define("${lwcSpecifier}", ["${lwcSpecifier.replace("lwc", "@lwc/engine-server")}"], function(lwcEngine) { return lwcEngine; });`;
+  return `LWR.define("${lwcSpecifier}", ["${lwcSpecifier.replace("lwc", lwcEngineSpecifier)}"], function(lwcEngine) { return lwcEngine; });`;
 }
 var GLOBALTHIS_LWR = `globalThis.LWR = globalThis.LWR || {};`;
-async function getCode(runtimeEnvironment, lwrVersion, bundleSpecifier, includedModules) {
-  const loaderShimSource2 = await getLoaderShim(runtimeEnvironment);
+async function getCode(runtimeEnvironment, lwrVersion, bundleSpecifier, includedModules, resourceRegistry) {
+  const loaderShimSource2 = await getLoaderShim(resourceRegistry, runtimeEnvironment);
   const lwrConfigString = JSON.stringify(getLwrConfig(bundleSpecifier, lwrVersion));
   const lwcSpecifier = includedModules.reduce((specifier, includedModule) => {
     if (includedModule.startsWith("lwc/v")) {
       return includedModule;
     }
-    if (!specifier && includedModule.startsWith("@lwc/engine-server/v")) {
-      return includedModule.replace("@lwc/engine-server", "lwc");
+    if (!specifier && includedModule.startsWith(`${lwcEngineSpecifier}/v`)) {
+      return includedModule.replace(lwcEngineSpecifier, "lwc");
     }
     return specifier;
   }, "");
@@ -95,3 +93,42 @@ async function getCode(runtimeEnvironment, lwrVersion, bundleSpecifier, included
     lwcSpecifier ? lwcDefineOverride(lwcSpecifier) : ""
   ];
 }
+async function getBundle(specifier, moduleBundler, runtimeEnvironment) {
+  if ((0, import_shared_utils.getFeatureFlags)().SSR_STATIC_BUNDLES) {
+    return buildBundle(specifier, moduleBundler, runtimeEnvironment);
+  }
+  return bundle(specifier, moduleBundler, runtimeEnvironment, {appendExcludes: false, exclude: ["lwc"]});
+}
+async function bundle(specifier, moduleBundler, runtimeEnvironment, bundleConfigOverrides) {
+  return await moduleBundler.getModuleBundle({specifier}, runtimeEnvironment, void 0, bundleConfigOverrides);
+}
+async function buildBundle(ssrSpecifier, moduleBundler, runtimeEnvironment) {
+  const rootSpecifier = ssrSpecifier.replace(import_identity.LWC_SSR_PREFIX, "");
+  const {code: _rootCode, bundleRecord: rootBundleRecord} = await bundle(rootSpecifier, moduleBundler, runtimeEnvironment);
+  let rootCode = _rootCode;
+  if (rootBundleRecord.imports) {
+    for (const {specifier} of rootBundleRecord.imports) {
+      if (specifier !== "lwc") {
+        const {code: code2} = await bundle(specifier, moduleBundler, runtimeEnvironment);
+        rootCode = code2 + rootCode;
+      }
+    }
+  }
+  const {code: lwcEngineCode, version: lwcVersion} = await bundle(lwcEngineSpecifier, moduleBundler, runtimeEnvironment);
+  const {
+    bundleRecord,
+    code: ssrCode,
+    version: lwrVersion
+  } = await bundle(ssrSpecifier, moduleBundler, runtimeEnvironment, {
+    appendExcludes: true,
+    exclude: [lwcEngineSpecifier, rootSpecifier]
+  });
+  const code = rootCode + lwcEngineCode + ssrCode;
+  bundleRecord.includedModules.push(`${lwcEngineSpecifier}/v/${(0, import_shared_utils.normalizeVersionToUri)(lwcVersion)}`);
+  return {
+    bundleRecord,
+    code,
+    specifier: ssrSpecifier,
+    version: lwrVersion
+  };
+}

package/build/cjs/viewTransformer/index.cjs

@@ -29,63 +29,69 @@ __export(exports, {
 var import_shared_utils = __toModule(require("@lwrjs/shared-utils"));
 var import_identity = __toModule(require("../identity.cjs"));
 var import_ssr_element = __toModule(require("./ssr-element.cjs"));
-function lwcSsrViewTranformer(options, {moduleBundler}) {
+function lwcSsrViewTranformer(options, {moduleBundler, resourceRegistry}) {
   return {
     name: "ssr-lwc-transformer",
     async link(stringBuilder, viewContext, {customElements}) {
-      import_shared_utils.logger.debug("lwcSsrViewTranformer");
-      import_shared_utils.logger.verbose("lwcSsrViewTranformer input", stringBuilder);
-      if (process.env.LOCKER === "true") {
-        return;
+      import_shared_utils.logger.debug("[lwcSsrViewTranformer] link");
+      import_shared_utils.logger.verbose("[lwcSsrViewTranformer] link input", stringBuilder);
+      if (process.env.LOCKER === "true" || !viewContext.view.bootstrap?.ssr) {
+        return {};
       }
-      if (viewContext.view.bootstrap?.ssr) {
-        const ssrModules = [];
-        for (const {tagName, location, props} of customElements) {
-          if (location) {
-            const {startOffset, endOffset} = location;
-            const moduleSpecifier = (0, import_shared_utils.kebabCaseToModuleSpecifer)(tagName);
-            ssrModules.push({
-              startOffset,
-              endOffset,
-              props,
-              tagName,
-              specifier: `${import_identity.LWC_SSR_PREFIX}${moduleSpecifier}`
-            });
-          }
-        }
-        const ssrProps = {};
-        let ssrLinks = "";
-        await Promise.all(ssrModules.map(({specifier, tagName, props, startOffset, endOffset}) => {
-          return (0, import_ssr_element.ssrElement)({specifier, props}, moduleBundler, viewContext).then(({html, props: props2, markup: {links = []} = {links: []}}) => {
-            if (props2) {
-              const propsId = (0, import_identity.getPropsId)();
-              ssrProps[propsId] = props2;
-              const [, remain] = html.split(`<${tagName}`);
-              html = [`<${tagName}`, ` ${import_identity.SSR_PROPS_ATTR}="${propsId}"`, remain].join("");
-            }
-            links.forEach(({href, rel, as, fetchpriority}) => {
-              const relStr = rel ? ` rel="${rel}"` : "", asStr = as ? ` as="${as}"` : "", fetchStr = fetchpriority ? ` fetchpriority="${fetchpriority}"` : "";
-              ssrLinks += `<link href="${href}"${relStr}${asStr}${fetchStr}>
-`;
-            });
-            stringBuilder.overwrite(startOffset, endOffset, html);
-          }).catch((err) => {
-            import_shared_utils.logger.warn(`Server-side rendering for "${specifier}" failed. Falling back to client-side rendering. Reason: `, err.stack);
+      const ssrModules = [];
+      for (const {tagName, location, props} of customElements) {
+        if (location) {
+          const {startOffset, endOffset} = location;
+          const moduleSpecifier = (0, import_shared_utils.kebabCaseToModuleSpecifier)(tagName);
+          ssrModules.push({
+            startOffset,
+            endOffset,
+            props,
+            tagName,
+            specifier: `${import_identity.LWC_SSR_PREFIX}${moduleSpecifier}`
           });
-        }));
-        if (Object.keys(ssrProps).length) {
-          stringBuilder.prependLeft(ssrModules[0].startOffset, `<script type="application/javascript">globalThis.LWR = globalThis.LWR || {};globalThis.LWR.${import_identity.SSR_PROPS_KEY} = ${JSON.stringify(ssrProps)};</script>`);
         }
-        if (ssrLinks) {
-          const headIndex = stringBuilder.original.indexOf("</head>");
-          if (headIndex >= 0) {
-            stringBuilder.prependLeft(headIndex, ssrLinks);
-          } else {
-            import_shared_utils.logger.error("Adding links during server-side rendering failed. Could not find the </head> tag.");
+      }
+      const ssrProps = {};
+      let ssrLinks = "";
+      let pageTtl;
+      await Promise.all(ssrModules.map(({specifier, tagName, props, startOffset, endOffset}) => {
+        return (0, import_ssr_element.ssrElement)({specifier, props}, moduleBundler, resourceRegistry, viewContext).then(({
+          html,
+          props: props2,
+          markup: {links = []} = {links: []},
+          cache: {ttl} = {}
+        }) => {
+          pageTtl = (0, import_shared_utils.shortestTtl)(ttl, pageTtl);
+          if (props2) {
+            const propsId = (0, import_identity.getPropsId)();
+            ssrProps[propsId] = props2;
+            const [, remain] = html.split(`<${tagName}`);
+            html = [`<${tagName}`, ` ${import_identity.SSR_PROPS_ATTR}="${propsId}"`, remain].join("");
           }
+          links.forEach(({href, rel, as, fetchpriority}) => {
+            const relStr = rel ? ` rel="${rel}"` : "", asStr = as ? ` as="${as}"` : "", fetchStr = fetchpriority ? ` fetchpriority="${fetchpriority}"` : "";
+            ssrLinks += `<link href="${href}"${relStr}${asStr}${fetchStr}>
+`;
+          });
+          stringBuilder.overwrite(startOffset, endOffset, html);
+        }).catch((err) => {
+          import_shared_utils.logger.warn(`Server-side rendering for "${specifier}" failed. Reason: `, err.stack);
+        });
+      }));
+      if (Object.keys(ssrProps).length) {
+        stringBuilder.prependLeft(ssrModules[0].startOffset, `<script type="application/javascript">globalThis.LWR = globalThis.LWR || {};globalThis.LWR.${import_identity.SSR_PROPS_KEY} = ${JSON.stringify(ssrProps)};</script>`);
+      }
+      if (ssrLinks) {
+        const headIndex = stringBuilder.original.indexOf("</head>");
+        if (headIndex >= 0) {
+          stringBuilder.prependLeft(headIndex, ssrLinks);
+        } else {
+          import_shared_utils.logger.error("Adding links during server-side rendering failed. Could not find the </head> tag.");
         }
-        import_shared_utils.logger.verbose("lwcSsrViewTranformer response", stringBuilder);
       }
+      import_shared_utils.logger.verbose("lwcSsrViewTranformer response", stringBuilder);
+      return {cache: {ttl: pageTtl}};
     }
   };
 }

package/build/cjs/viewTransformer/sandbox.cjs

@@ -28,9 +28,10 @@ __export(exports, {
 });
 var import_sandbox_worker = __toModule(require("./sandbox-worker.cjs"));
 var import_sandbox_locker = __toModule(require("./sandbox-locker.cjs"));
+var import_shared_utils = __toModule(require("@lwrjs/shared-utils"));
 function runCode(codes, context) {
-  if (process.env.LOCKER_SB === "true") {
-    return (0, import_sandbox_locker.default)(codes, context);
+  if ((0, import_shared_utils.getFeatureFlags)().SSR_SANDBOX_WORKER) {
+    return (0, import_sandbox_worker.default)(codes, context);
   }
-  return (0, import_sandbox_worker.default)(codes, context);
+  return (0, import_sandbox_locker.default)(codes, context);
 }

package/build/cjs/viewTransformer/ssr-element.cjs

@@ -29,7 +29,8 @@ __export(exports, {
 var import_amd_utils = __toModule(require("./amd-utils.cjs"));
 var import_sandbox = __toModule(require("./sandbox.cjs"));
 var import_perf_hooks = __toModule(require("perf_hooks"));
-async function ssrElement({specifier, props: templateProps}, moduleBundler, {runtimeEnvironment, runtimeParams}) {
+var import_shared_utils = __toModule(require("@lwrjs/shared-utils"));
+async function ssrElement({specifier, props: templateProps}, moduleBundler, resourceRegistry, {runtimeEnvironment, runtimeParams}) {
   const {format} = runtimeEnvironment;
   const {
     bundleRecord,
@@ -41,9 +42,7 @@ async function ssrElement({specifier, props: templateProps}, moduleBundler, {run
     alias: {
       lwc: "@lwc/engine-server"
     }
-  }) : await moduleBundler.getModuleBundle({specifier}, runtimeEnvironment, void 0, {
-    exclude: ["lwc"]
-  });
+  }) : await (0, import_amd_utils.getBundle)(specifier, moduleBundler, runtimeEnvironment);
   const context = {
     props: templateProps,
     params: runtimeParams.params || {},
@@ -51,12 +50,14 @@ async function ssrElement({specifier, props: templateProps}, moduleBundler, {run
     locale: runtimeParams.locale || runtimeEnvironment.defaultLocale
   };
   const startTime = import_perf_hooks.performance.now();
-  const {result, props, markup} = format === "amd" ? await (0, import_sandbox.default)([
-    ...await (0, import_amd_utils.default)(runtimeEnvironment, version.replace(/\./g, "_"), bundleSpecifier, bundleRecord.includedModules),
+  const {result, props, markup, cache, error} = format === "amd" ? await (0, import_sandbox.default)([
+    ...await (0, import_amd_utils.getCode)(runtimeEnvironment, version.replace(/\./g, "_"), bundleSpecifier, bundleRecord.includedModules, resourceRegistry),
     code
   ], context) : await (0, import_sandbox.default)([code], context);
   const endTime = import_perf_hooks.performance.now();
   const timeDiff = endTime - startTime;
-  console.log(`[${specifier} SSR] complete in ${timeDiff} ms`);
-  return {html: result, props, markup};
+  import_shared_utils.logger.info(`[Server-side Rendering] ${specifier} in ${Math.round(timeDiff)} ms`);
+  if (error)
+    throw new Error(error);
+  return {html: result, props, markup, cache};
 }

package/build/es/moduleProvider/index.d.ts

@@ -7,7 +7,7 @@ import { ModuleCompiled, ModuleEntry, ModuleProvider, ProviderContext, AbstractM
 /**
  * Create the virtual source for a module which server-side renders the given component.
  * This code is meant to be executed in a worker on the server; it is run from "lwc-ssr/viewTransformer#ssr-element" during linking.
- * The result is posted to the parentPort and the Promise in the main thread resolves.
+ * The result is returned to the caller and the Promise in the main thread resolves.
  * If available, getPageData() is called on the root component to mutate context.props and gather page markup
  * @param rootSpecifier - The specifier for the component to SSR
  * @returns the generated module source

package/build/es/moduleProvider/index.js

@@ -8,7 +8,7 @@ import { LWC_SSR_PREFIX } from '../identity.js';
 /**
  * Create the virtual source for a module which server-side renders the given component.
  * This code is meant to be executed in a worker on the server; it is run from "lwc-ssr/viewTransformer#ssr-element" during linking.
- * The result is posted to the parentPort and the Promise in the main thread resolves.
+ * The result is returned to the caller and the Promise in the main thread resolves.
  * If available, getPageData() is called on the root component to mutate context.props and gather page markup
  * @param rootSpecifier - The specifier for the component to SSR
  * @returns the generated module source
@@ -19,20 +19,26 @@ import { renderComponent } from '@lwc/engine-server';
 import Ctor, * as rootComponent from '${rootSpecifier}';
 
 (async () => {
-    // 1. setup page data
-    const context = globalThis.getContext();
-    let props = context.props;
-    let markup;
-    if (rootComponent.getPageData) {
-        const data = await rootComponent.getPageData(context);
-        props = data.props; // overwrite public props
-        markup = data.markup;
-    }
+    let result, props, markup;
+    try {
+        // 1. setup page data
+        const context = globalThis.getContext();
+        props = context.props;
+        if (rootComponent.getPageData) {
+            const data = await rootComponent.getPageData(context);
+            props = data.props; // overwrite public props
+            markup = data.markup;
+        }
 
-    // 2. render component
-    const result = renderComponent('${moduleSpecifierToKebabCase(rootSpecifier)}', Ctor, props || {});
+        // 2. render component
+        result = renderComponent('${moduleSpecifierToKebabCase(rootSpecifier)}', Ctor, props || {});
+
+    } catch(e) {
+        // (3) relay error
+        globalThis.resolver({ error: e.message || e });
+    }
 
-    // 3. relay results
+    // 3. relay successful results
     globalThis.resolver({ result, props, markup });
 })()`;
 }

package/build/es/viewTransformer/amd-utils.d.ts

@@ -1,3 +1,7 @@
-import { RuntimeEnvironment } from '@lwrjs/types';
-export default function getCode(runtimeEnvironment: RuntimeEnvironment, lwrVersion: string, bundleSpecifier: string, includedModules: string[]): Promise<string[]>;
+import type { BundleDefinition, PublicModuleBundler, PublicResourceRegistry, RuntimeEnvironment } from '@lwrjs/types';
+export declare function getCode(runtimeEnvironment: RuntimeEnvironment, lwrVersion: string, bundleSpecifier: string, includedModules: string[], resourceRegistry: PublicResourceRegistry): Promise<string[]>;
+declare type PartialBundleDefinition = Pick<BundleDefinition, 'bundleRecord' | 'code' | 'specifier' | 'version'>;
+export declare function getBundle(specifier: string, // e.g. "@lwrjs/lwc-ssr/root/component"
+moduleBundler: PublicModuleBundler, runtimeEnvironment: RuntimeEnvironment): Promise<PartialBundleDefinition>;
+export {};
 //# sourceMappingURL=amd-utils.d.ts.map

package/build/es/viewTransformer/amd-utils.js

@@ -1,5 +1,6 @@
-import AmdLoaderShimService from '@lwrjs/loader';
-import { getFeatureFlags } from '@lwrjs/shared-utils';
+import { getFeatureFlags, normalizeVersionToUri } from '@lwrjs/shared-utils';
+import { LWC_SSR_PREFIX } from '../identity.js';
+const lwcEngineSpecifier = '@lwc/engine-server';
 async function readableToString(readable) {
     let result = '';
     for await (const chunk of readable) {
@@ -8,22 +9,18 @@ async function readableToString(readable) {
     return result;
 }
 let loaderShimSource;
-async function getLoaderShim(runtimeEnvironment) {
+async function getLoaderShim(resourceRegistry, runtimeEnvironment) {
     if (loaderShimSource !== undefined) {
         return loaderShimSource;
     }
-    const amdloaderShimService = new AmdLoaderShimService({}, {
-        runtimeEnvironment,
-        resourceRegistry: { resolveResourceUri: () => 'NOT IMPLEMENTED' },
-    });
     const specifier = getFeatureFlags().LEGACY_LOADER
-        ? 'lwr-loader-shim-legacy.bundle.js'
-        : 'lwr-loader-shim.bundle.js';
-    const resource = await amdloaderShimService.getResource({ specifier }, runtimeEnvironment);
+        ? 'lwr-loader-shim-legacy.bundle.min.js'
+        : 'lwr-loader-shim.bundle.min.js';
+    const resource = await resourceRegistry.getResource({ specifier }, runtimeEnvironment);
     if (resource) {
         const { stream } = resource;
         if (stream) {
-            loaderShimSource = await readableToString(stream);
+            loaderShimSource = await readableToString(stream());
             return loaderShimSource;
         }
     }
@@ -51,11 +48,11 @@ function getLwrConfig(bundleSpecifier, lwrVersion) {
 }
 // lwc/v/2_13_0 -> @lwc/engine-server/v/2_13_0
 function lwcDefineOverride(lwcSpecifier) {
-    return `LWR.define("${lwcSpecifier}", ["${lwcSpecifier.replace('lwc', '@lwc/engine-server')}"], function(lwcEngine) { return lwcEngine; });`;
+    return `LWR.define("${lwcSpecifier}", ["${lwcSpecifier.replace('lwc', lwcEngineSpecifier)}"], function(lwcEngine) { return lwcEngine; });`;
 }
 const GLOBALTHIS_LWR = `globalThis.LWR = globalThis.LWR || {};`;
-export default async function getCode(runtimeEnvironment, lwrVersion, bundleSpecifier, includedModules) {
-    const loaderShimSource = await getLoaderShim(runtimeEnvironment);
+export async function getCode(runtimeEnvironment, lwrVersion, bundleSpecifier, includedModules, resourceRegistry) {
+    const loaderShimSource = await getLoaderShim(resourceRegistry, runtimeEnvironment);
     const lwrConfigString = JSON.stringify(getLwrConfig(bundleSpecifier, lwrVersion));
     const lwcSpecifier = includedModules.reduce((specifier, includedModule) => {
         if (includedModule.startsWith('lwc/v')) {
@@ -63,8 +60,8 @@ export default async function getCode(runtimeEnvironment, lwrVersion, bundleSpec
         }
         // define `lwc` when `@lwc/engine-server` is included in the bundle
         // `lwc` will be excluded by default when bundling is enabled
-        if (!specifier && includedModule.startsWith('@lwc/engine-server/v')) {
-            return includedModule.replace('@lwc/engine-server', 'lwc');
+        if (!specifier && includedModule.startsWith(`${lwcEngineSpecifier}/v`)) {
+            return includedModule.replace(lwcEngineSpecifier, 'lwc');
         }
         return specifier;
     }, '');
@@ -78,4 +75,55 @@ export default async function getCode(runtimeEnvironment, lwrVersion, bundleSpec
         lwcSpecifier ? lwcDefineOverride(lwcSpecifier) : '',
     ];
 }
+export async function getBundle(specifier, // e.g. "@lwrjs/lwc-ssr/root/component"
+moduleBundler, runtimeEnvironment) {
+    if (getFeatureFlags().SSR_STATIC_BUNDLES) {
+        // concatenate existing bundles SSGed at build time
+        return buildBundle(specifier, moduleBundler, runtimeEnvironment);
+    }
+    // create a new SSR bundle
+    // "lwc" is aliased as "@lwc/engine-server" in the AMD worker code
+    return bundle(specifier, moduleBundler, runtimeEnvironment, { appendExcludes: false, exclude: ['lwc'] });
+}
+async function bundle(specifier, moduleBundler, runtimeEnvironment, bundleConfigOverrides) {
+    return await moduleBundler.getModuleBundle({ specifier }, runtimeEnvironment, undefined, bundleConfigOverrides);
+}
+// Build a SSR bundle for a root component by concatenating:
+// - the root component bundle
+// - @lwc/engine-server
+// - the SSR bundle for the root specifier
+async function buildBundle(ssrSpecifier, moduleBundler, runtimeEnvironment) {
+    // 1. Get the bundle for the root component
+    const rootSpecifier = ssrSpecifier.replace(LWC_SSR_PREFIX, '');
+    const { code: _rootCode, bundleRecord: rootBundleRecord } = await bundle(rootSpecifier, moduleBundler, runtimeEnvironment);
+    // 1a) Add the bundles imported into the root component bundle
+    let rootCode = _rootCode;
+    if (rootBundleRecord.imports) {
+        for (const { specifier } of rootBundleRecord.imports) {
+            if (specifier !== 'lwc') {
+                // TODO: recurse the imports to support chains of excluded modules
+                // eslint-disable-next-line no-await-in-loop
+                const { code } = await bundle(specifier, moduleBundler, runtimeEnvironment);
+                rootCode = code + rootCode;
+            }
+        }
+    }
+    // 2. Get the bundle for the LWC engine
+    const { code: lwcEngineCode, version: lwcVersion } = await bundle(lwcEngineSpecifier, moduleBundler, runtimeEnvironment);
+    // 3. Get the SSR bundle for the root component
+    // Exclude the LWC engine and root component from this bundle. Use the pre-built bundles fetched above instead.
+    const { bundleRecord, code: ssrCode, version: lwrVersion, } = await bundle(ssrSpecifier, moduleBundler, runtimeEnvironment, {
+        appendExcludes: true,
+        exclude: [lwcEngineSpecifier, rootSpecifier],
+    });
+    // Now concatenate the code gathered above to create the SSR bundle for the root component
+    const code = rootCode + lwcEngineCode + ssrCode;
+    bundleRecord.includedModules.push(`${lwcEngineSpecifier}/v/${normalizeVersionToUri(lwcVersion)}`); // for LWC aliasing
+    return {
+        bundleRecord,
+        code,
+        specifier: ssrSpecifier,
+        version: lwrVersion,
+    };
+}
 //# sourceMappingURL=amd-utils.js.map

package/build/es/viewTransformer/index.d.ts

@@ -20,6 +20,6 @@ interface SsrPluginOptions {
  * 4. The view/page document now contains SSRed components, which will be sent to the client
  * 5. During bootstrap on the client, the "lwr/initSsr" module will hydrate ALL the custom elements on the page
  */
-export default function lwcSsrViewTranformer(options: SsrPluginOptions, { moduleBundler }: ProviderContext): ViewTransformPlugin;
+export default function lwcSsrViewTranformer(options: SsrPluginOptions, { moduleBundler, resourceRegistry }: ProviderContext): ViewTransformPlugin;
 export {};
 //# sourceMappingURL=index.d.ts.map

package/build/es/viewTransformer/index.js

@@ -1,4 +1,4 @@
-import { kebabCaseToModuleSpecifer, logger } from '@lwrjs/shared-utils';
+import { kebabCaseToModuleSpecifier, logger, shortestTtl } from '@lwrjs/shared-utils';
 import { LWC_SSR_PREFIX, SSR_PROPS_ATTR, SSR_PROPS_KEY, getPropsId } from '../identity.js';
 import { ssrElement } from './ssr-element.js';
 /**
@@ -19,76 +19,78 @@ import { ssrElement } from './ssr-element.js';
  * 4. The view/page document now contains SSRed components, which will be sent to the client
  * 5. During bootstrap on the client, the "lwr/initSsr" module will hydrate ALL the custom elements on the page
  */
-export default function lwcSsrViewTranformer(options, { moduleBundler }) {
+export default function lwcSsrViewTranformer(options, { moduleBundler, resourceRegistry }) {
     return {
         name: 'ssr-lwc-transformer',
         async link(stringBuilder, viewContext, { customElements }) {
-            logger.debug('lwcSsrViewTranformer');
-            logger.verbose('lwcSsrViewTranformer input', stringBuilder);
+            logger.debug('[lwcSsrViewTranformer] link');
+            logger.verbose('[lwcSsrViewTranformer] link input', stringBuilder);
             // SSR currently does not support locker because the module constructor returns undefined
             // and the call to renderComponent would fail
-            if (process.env.LOCKER === 'true') {
-                return;
+            if (process.env.LOCKER === 'true' || !viewContext.view.bootstrap?.ssr) {
+                return {}; // no SSR
             }
-            if (viewContext.view.bootstrap?.ssr) {
-                // Gather all the SSRable custom elements (ie: root components) into 1 list
-                const ssrModules = [];
-                for (const { tagName, location, props } of customElements) {
-                    if (location) {
-                        const { startOffset, endOffset } = location;
-                        const moduleSpecifier = kebabCaseToModuleSpecifer(tagName);
-                        ssrModules.push({
-                            startOffset,
-                            endOffset,
-                            props,
-                            tagName,
-                            specifier: `${LWC_SSR_PREFIX}${moduleSpecifier}`,
-                        });
-                    }
-                }
-                // SSR and gather the properties and links for each eligible custom element, in parallel
-                const ssrProps = {};
-                let ssrLinks = '';
-                await Promise.all(ssrModules.map(({ specifier, tagName, props, startOffset, endOffset }) => {
-                    return ssrElement({ specifier, props }, moduleBundler, viewContext)
-                        .then(({ html, props, markup: { links = [] } = { links: [] } }) => {
-                        if (props) {
-                            // Add the props id to the HTML for the custom element
-                            // eg: <some-cmp> -> <some-cmp data-lwr-props-id="1234">
-                            const propsId = getPropsId();
-                            ssrProps[propsId] = props;
-                            const [, remain] = html.split(`<${tagName}`);
-                            html = [`<${tagName}`, ` ${SSR_PROPS_ATTR}="${propsId}"`, remain].join('');
-                        }
-                        links.forEach(({ href, rel, as, fetchpriority }) => {
-                            // Create HTML <link> strings for each item in the links array
-                            const relStr = rel ? ` rel="${rel}"` : '', asStr = as ? ` as="${as}"` : '', fetchStr = fetchpriority ? ` fetchpriority="${fetchpriority}"` : '';
-                            ssrLinks += `<link href="${href}"${relStr}${asStr}${fetchStr}>\n`;
-                        });
-                        // Overwrite the custom element with the SSRed component string
-                        stringBuilder.overwrite(startOffset, endOffset, html);
-                    })
-                        .catch((err) => {
-                        logger.warn(`Server-side rendering for "${specifier}" failed. Falling back to client-side rendering. Reason: `, err.stack);
+            // Gather all the SSRable custom elements (ie: root components) into 1 list
+            const ssrModules = [];
+            for (const { tagName, location, props } of customElements) {
+                if (location) {
+                    const { startOffset, endOffset } = location;
+                    const moduleSpecifier = kebabCaseToModuleSpecifier(tagName);
+                    ssrModules.push({
+                        startOffset,
+                        endOffset,
+                        props,
+                        tagName,
+                        specifier: `${LWC_SSR_PREFIX}${moduleSpecifier}`,
                     });
-                }));
-                if (Object.keys(ssrProps).length) {
-                    // Serialize all root component properties into a single script for the page
-                    // Append the script before the custom elements; it MUST appear before the AMD shim to avoid timing issues
-                    stringBuilder.prependLeft(ssrModules[0].startOffset, `<script type="application/javascript">globalThis.LWR = globalThis.LWR || {};globalThis.LWR.${SSR_PROPS_KEY} = ${JSON.stringify(ssrProps)};</script>`);
                 }
-                if (ssrLinks) {
-                    // Add all the links to the <head> section of the base document
-                    const headIndex = stringBuilder.original.indexOf('</head>');
-                    if (headIndex >= 0) {
-                        stringBuilder.prependLeft(headIndex, ssrLinks);
-                    }
-                    else {
-                        logger.error('Adding links during server-side rendering failed. Could not find the </head> tag.');
+            }
+            // SSR and gather the properties and links for each eligible custom element, in parallel
+            const ssrProps = {};
+            let ssrLinks = '';
+            let pageTtl;
+            await Promise.all(ssrModules.map(({ specifier, tagName, props, startOffset, endOffset }) => {
+                return ssrElement({ specifier, props }, moduleBundler, resourceRegistry, viewContext)
+                    .then(({ html, props, markup: { links = [] } = { links: [] }, cache: { ttl } = {}, }) => {
+                    // Keep track of the shortest TTL from all getPageData hooks
+                    pageTtl = shortestTtl(ttl, pageTtl);
+                    if (props) {
+                        // Add the props id to the HTML for the custom element
+                        // eg: <some-cmp> -> <some-cmp data-lwr-props-id="1234">
+                        const propsId = getPropsId();
+                        ssrProps[propsId] = props;
+                        const [, remain] = html.split(`<${tagName}`);
+                        html = [`<${tagName}`, ` ${SSR_PROPS_ATTR}="${propsId}"`, remain].join('');
                     }
+                    links.forEach(({ href, rel, as, fetchpriority }) => {
+                        // Create HTML <link> strings for each item in the links array
+                        const relStr = rel ? ` rel="${rel}"` : '', asStr = as ? ` as="${as}"` : '', fetchStr = fetchpriority ? ` fetchpriority="${fetchpriority}"` : '';
+                        ssrLinks += `<link href="${href}"${relStr}${asStr}${fetchStr}>\n`;
+                    });
+                    // Overwrite the custom element with the SSRed component string
+                    stringBuilder.overwrite(startOffset, endOffset, html);
+                })
+                    .catch((err) => {
+                    logger.warn(`Server-side rendering for "${specifier}" failed. Reason: `, err.stack);
+                });
+            }));
+            if (Object.keys(ssrProps).length) {
+                // Serialize all root component properties into a single script for the page
+                // Append the script before the custom elements; it MUST appear before the AMD shim to avoid timing issues
+                stringBuilder.prependLeft(ssrModules[0].startOffset, `<script type="application/javascript">globalThis.LWR = globalThis.LWR || {};globalThis.LWR.${SSR_PROPS_KEY} = ${JSON.stringify(ssrProps)};</script>`);
+            }
+            if (ssrLinks) {
+                // Add all the links to the <head> section of the base document
+                const headIndex = stringBuilder.original.indexOf('</head>');
+                if (headIndex >= 0) {
+                    stringBuilder.prependLeft(headIndex, ssrLinks);
+                }
+                else {
+                    logger.error('Adding links during server-side rendering failed. Could not find the </head> tag.');
                 }
-                logger.verbose('lwcSsrViewTranformer response', stringBuilder);
             }
+            logger.verbose('lwcSsrViewTranformer response', stringBuilder);
+            return { cache: { ttl: pageTtl } };
         },
     };
 }

package/build/es/viewTransformer/sandbox-locker.d.ts

@@ -1,7 +1,4 @@
-import { PageDataResponse, SsrRequestContext } from '@lwrjs/types';
-interface SandboxResults extends PageDataResponse {
-    result?: string;
-}
+import type { SsrRequestContext } from '@lwrjs/types';
+import type { SandboxResults } from './sandbox.js';
 export default function runCode(codes: string[], context: SsrRequestContext): Promise<SandboxResults>;
-export {};
 //# sourceMappingURL=sandbox-locker.d.ts.map

package/build/es/viewTransformer/sandbox-worker.d.ts

@@ -1,12 +1,9 @@
-import { PageDataResponse, SsrRequestContext } from '@lwrjs/types';
-interface SandboxResults extends PageDataResponse {
-    result?: string;
-}
+import type { SsrRequestContext } from '@lwrjs/types';
+import type { SandboxResults } from './sandbox.js';
 /**
  * Run the SSR module code in a worker, and return the results to the main thread.
  * @param codes - Code strings which SSR a root component
  * @returns a promise to the SSRed code string, or an error message
  */
 export default function runCode(codes: string[], workerData: SsrRequestContext): Promise<SandboxResults>;
-export {};
 //# sourceMappingURL=sandbox-worker.d.ts.map

package/build/es/viewTransformer/sandbox.d.ts

@@ -1,7 +1,7 @@
 import { PageDataResponse, SsrRequestContext } from '@lwrjs/types';
-interface SandboxResults extends PageDataResponse {
+export interface SandboxResults extends PageDataResponse {
     result?: string;
+    error?: string;
 }
 export default function runCode(codes: string[], context: SsrRequestContext): Promise<SandboxResults>;
-export {};
 //# sourceMappingURL=sandbox.d.ts.map

package/build/es/viewTransformer/sandbox.js

@@ -1,9 +1,11 @@
 import runCodeOnWorker from './sandbox-worker.js';
 import runCodeOnLocker from './sandbox-locker.js';
+import { getFeatureFlags } from '@lwrjs/shared-utils';
 export default function runCode(codes, context) {
-    if (process.env.LOCKER_SB === 'true') {
-        return runCodeOnLocker(codes, context);
+    if (getFeatureFlags().SSR_SANDBOX_WORKER) {
+        return runCodeOnWorker(codes, context);
     }
-    return runCodeOnWorker(codes, context);
+    // Default to use locker because it works rolled up in MRT
+    return runCodeOnLocker(codes, context);
 }
 //# sourceMappingURL=sandbox.js.map

package/build/es/viewTransformer/ssr-element.d.ts

@@ -1,4 +1,4 @@
-import type { Json, ModuleBundler, PageDataResponse, ViewTranformPluginContext } from '@lwrjs/types';
+import type { Json, PageDataResponse, PublicModuleBundler, PublicResourceRegistry, ViewTranformPluginContext } from '@lwrjs/types';
 interface SsrResults extends PageDataResponse {
     html: string;
 }
@@ -13,6 +13,6 @@ interface SsrResults extends PageDataResponse {
 export declare function ssrElement({ specifier, props: templateProps }: {
     specifier: string;
     props: Json;
-}, moduleBundler: ModuleBundler, { runtimeEnvironment, runtimeParams }: ViewTranformPluginContext): Promise<SsrResults>;
+}, moduleBundler: PublicModuleBundler, resourceRegistry: PublicResourceRegistry, { runtimeEnvironment, runtimeParams }: ViewTranformPluginContext): Promise<SsrResults>;
 export {};
 //# sourceMappingURL=ssr-element.d.ts.map

package/build/es/viewTransformer/ssr-element.js

@@ -1,6 +1,7 @@
-import getCode from './amd-utils.js';
+import { getBundle, getCode } from './amd-utils.js';
 import runCode from './sandbox.js';
 import { performance } from 'perf_hooks';
+import { logger } from '@lwrjs/shared-utils';
 /**
  * Create a bundle for the given SSR module and run the code in a sandbox.
  * @param moduleInfo - specifier: The ID of the module, generated by "lwc-ssr/moduleProvider", which SSRs a component
@@ -9,7 +10,7 @@ import { performance } from 'perf_hooks';
  * @param runtimeEnvironment
  * @returns a promise to the SSRed code string
  */
-export async function ssrElement({ specifier, props: templateProps }, moduleBundler, { runtimeEnvironment, runtimeParams }) {
+export async function ssrElement({ specifier, props: templateProps }, moduleBundler, resourceRegistry, { runtimeEnvironment, runtimeParams }) {
     const { format } = runtimeEnvironment;
     const { bundleRecord, code, specifier: bundleSpecifier, version, } = format === 'esm'
         ? await moduleBundler.getModuleBundle({ specifier }, 
@@ -23,10 +24,7 @@ export async function ssrElement({ specifier, props: templateProps }, moduleBund
                 lwc: '@lwc/engine-server',
             },
         })
-        : await moduleBundler.getModuleBundle({ specifier }, runtimeEnvironment, undefined, {
-            // "lwc" will be defined as an alias to "@lwc/engine-server" in the AMD worker code.
-            exclude: ['lwc'],
-        });
+        : await getBundle(specifier, moduleBundler, runtimeEnvironment);
     // Gather context to send into the SSR sandbox
     const context = {
         props: templateProps,
@@ -36,15 +34,17 @@ export async function ssrElement({ specifier, props: templateProps }, moduleBund
     };
     // Get the SSR string and properties bag
     const startTime = performance.now();
-    const { result, props, markup } = format === 'amd'
+    const { result, props, markup, cache, error } = format === 'amd'
         ? await runCode([
-            ...(await getCode(runtimeEnvironment, version.replace(/\./g, '_'), bundleSpecifier, bundleRecord.includedModules)),
+            ...(await getCode(runtimeEnvironment, version.replace(/\./g, '_'), bundleSpecifier, bundleRecord.includedModules, resourceRegistry)),
             code,
         ], context)
         : await runCode([code], context);
     const endTime = performance.now();
     const timeDiff = endTime - startTime;
-    console.log(`[${specifier} SSR] complete in ${timeDiff} ms`);
-    return { html: result, props, markup };
+    logger.info(`[Server-side Rendering] ${specifier} in ${Math.round(timeDiff)} ms`);
+    if (error)
+        throw new Error(error);
+    return { html: result, props, markup, cache };
 }
 //# sourceMappingURL=ssr-element.js.map

package/package.json

@@ -4,15 +4,15 @@
     "publishConfig": {
         "access": "public"
     },
-    "version": "0.9.0-alpha.3",
+    "version": "0.9.0-alpha.30",
     "homepage": "https://developer.salesforce.com/docs/platform/lwr/overview",
     "repository": {
         "type": "git",
-        "url": "https://github.com/salesforce/lwr.git",
+        "url": "https://github.com/salesforce-experience-platform-emu/lwr.git",
         "directory": "packages/@lwrjs/lwc-ssr"
     },
     "bugs": {
-        "url": "https://github.com/salesforce/lwr/issues"
+        "url": "https://github.com/salesforce-experience-platform-emu/lwr/issues"
     },
     "types": "build/es/index.d.ts",
     "type": "module",
@@ -33,16 +33,16 @@
         "build/**/*.d.ts"
     ],
     "dependencies": {
-        "@locker/near-membrane-node": "^0.11.6",
-        "@lwrjs/diagnostics": "0.9.0-alpha.3",
-        "@lwrjs/shared-utils": "0.9.0-alpha.3",
-        "node-fetch": "^2.6.1"
+        "@locker/near-membrane-node": "^0.12.0",
+        "@lwrjs/diagnostics": "0.9.0-alpha.30",
+        "@lwrjs/shared-utils": "0.9.0-alpha.30",
+        "node-fetch": "^2.6.8"
     },
     "devDependencies": {
-        "@lwrjs/types": "0.9.0-alpha.3"
+        "@lwrjs/types": "0.9.0-alpha.30"
     },
     "engines": {
-        "node": ">=14.15.4 <19"
+        "node": ">=16.0.0 <20"
     },
-    "gitHead": "3e96a852db94afbbfbc6558098303a85acd6604d"
+    "gitHead": "6e18768b8e47066c41ae0b792bf4aa766b0b784b"
 }