@modern-js/runtime 2.64.1 → 2.64.2

package/dist/cjs/cli/code.js

@@ -55,7 +55,7 @@ function getSSRMode(entry, config) {
 const generateCode = async (entrypoints, appContext, config, hooks) => {
   const { mountId } = config.html;
   const { enableAsyncEntry } = config.source;
-  const { runtimeConfigFile, internalDirectory, internalSrcAlias, metaName, srcDirectory } = appContext;
+  const { runtimeConfigFile, internalDirectory, internalSrcAlias, metaName, srcDirectory, serverRoutes } = appContext;
   await Promise.all(entrypoints.map(async (entrypoint) => {
     const { entryName, isAutoMount, entry, customEntry, customBootstrap, customServerEntry } = entrypoint;
     const { plugins: runtimePlugins } = await hooks._internalRuntimePlugins.call({
@@ -63,25 +63,37 @@ const generateCode = async (entrypoints, appContext, config, hooks) => {
       plugins: []
     });
     if (isAutoMount) {
-      const indexCode = template.index({
-        srcDirectory,
-        internalSrcAlias,
-        metaName,
-        entry,
-        entryName,
-        customEntry,
-        customBootstrap,
-        mountId
-      });
-      const indexFile = import_path.default.resolve(internalDirectory, `./${entryName}/${import_constants.ENTRY_POINT_FILE_NAME}`);
-      import_utils.fs.outputFileSync(indexFile, indexCode, "utf8");
       const ssrMode = getSSRMode(entryName, config);
+      let indexCode = "";
+      if (!ssrMode && config.server.rsc) {
+        var _serverRoutes_find;
+        indexCode = template.entryForCSRWithRSC({
+          metaName,
+          entryName,
+          mountId,
+          urlPath: (_serverRoutes_find = serverRoutes.find((route) => route.entryName === entryName)) === null || _serverRoutes_find === void 0 ? void 0 : _serverRoutes_find.urlPath
+        });
+      } else {
+        indexCode = template.index({
+          srcDirectory,
+          internalSrcAlias,
+          metaName,
+          entry,
+          entryName,
+          customEntry,
+          customBootstrap,
+          mountId,
+          enableRsc: config.server.rsc
+        });
+      }
+      const indexFile = import_path.default.resolve(internalDirectory, `./${entryName}/${import_constants.ENTRY_POINT_FILE_NAME}`);
+      await import_utils.fs.outputFile(indexFile, indexCode, "utf8");
       if (enableAsyncEntry) {
         const bootstrapFile = import_path.default.resolve(internalDirectory, `./${entryName}/${import_constants.ENTRY_BOOTSTRAP_FILE_NAME}`);
-        import_utils.fs.outputFileSync(bootstrapFile, `import(/* webpackChunkName: "async-${entryName}" */ './${import_constants.INDEX_FILE_NAME}');`, "utf8");
+        await import_utils.fs.outputFile(bootstrapFile, `import(/* webpackChunkName: "async-${entryName}" */ './${import_constants.INDEX_FILE_NAME}');`, "utf8");
         const bootstrapServerFile = import_path.default.resolve(internalDirectory, `./${entryName}/${import_constants.ENTRY_SERVER_BOOTSTRAP_FILE_NAME}`);
         if (ssrMode) {
-          import_utils.fs.outputFileSync(bootstrapServerFile, `export const requestHandler = import('./${import_constants.SERVER_ENTRY_POINT_FILE_NAME}').then((m) => m.requestHandler)`, "utf8");
+          await import_utils.fs.outputFile(bootstrapServerFile, `export const requestHandler = import('./${import_constants.SERVER_ENTRY_POINT_FILE_NAME}').then((m) => m.requestHandler)`, "utf8");
         }
       }
       if (ssrMode) {
@@ -92,14 +104,21 @@ const generateCode = async (entrypoints, appContext, config, hooks) => {
           metaName,
           mode: ssrMode,
           customServerEntry,
-          srcDirectory
+          srcDirectory,
+          enableRsc: config.server.rsc
         });
         const indexServerFile = import_path.default.resolve(internalDirectory, `./${entryName}/${import_constants.SERVER_ENTRY_POINT_FILE_NAME}`);
-        import_utils.fs.outputFileSync(indexServerFile, indexServerCode, "utf8");
+        await import_utils.fs.outputFile(indexServerFile, indexServerCode, "utf8");
+      } else if (config.server.rsc) {
+        const indexServerFile = import_path.default.resolve(internalDirectory, `./${entryName}/${import_constants.SERVER_ENTRY_POINT_FILE_NAME}`);
+        const indexServerCode = serverTemplate.entryForCSRWithRSC({
+          metaName
+        });
+        await import_utils.fs.outputFile(indexServerFile, indexServerCode, "utf8");
       }
       const registerCode = template.register();
       const registerFile = import_path.default.resolve(internalDirectory, `./${entryName}/${import_constants.ENTRY_POINT_REGISTER_FILE_NAME}`);
-      import_utils.fs.outputFileSync(registerFile, registerCode, "utf8");
+      await import_utils.fs.outputFile(registerFile, registerCode, "utf8");
       const registerRuntimeCode = template.runtimeRegister({
         entryName,
         srcDirectory,
@@ -109,16 +128,36 @@ const generateCode = async (entrypoints, appContext, config, hooks) => {
         runtimePlugins
       });
       const registerRuntimeFile = import_path.default.resolve(internalDirectory, `./${entryName}/${import_constants.ENTRY_POINT_RUNTIME_REGISTER_FILE_NAME}`);
-      import_utils.fs.outputFileSync(registerRuntimeFile, registerRuntimeCode, "utf8");
-      const contextCode = template.runtimeGlobalContext({
-        srcDirectory,
-        internalSrcAlias,
-        metaName,
-        entry,
-        customEntry
-      });
-      const contextFile = import_path.default.resolve(internalDirectory, `./${entryName}/${import_constants.ENTRY_POINT_RUNTIME_GLOBAL_CONTEXT_FILE_NAME}`);
-      import_utils.fs.outputFileSync(contextFile, contextCode, "utf8");
+      await import_utils.fs.outputFile(registerRuntimeFile, registerRuntimeCode, "utf8");
+      let contextCode = "";
+      if (!config.server.rsc) {
+        contextCode = template.runtimeGlobalContext({
+          srcDirectory,
+          internalSrcAlias,
+          metaName,
+          entry,
+          customEntry
+        });
+      } else {
+        const AppProxyPath = import_path.default.join(internalDirectory, entryName, "./AppProxy.jsx");
+        const appProxyCode = template.AppProxyForRSC({
+          srcDirectory,
+          internalSrcAlias,
+          entry,
+          customEntry
+        });
+        await import_utils.fs.outputFile(AppProxyPath, appProxyCode);
+        contextCode = template.runtimeGlobalContextForRSCClient({
+          metaName
+        });
+        const contextServerCode = template.runtimeGlobalContextForRSCServer({
+          metaName
+        });
+        const contextFile2 = import_path.default.resolve(internalDirectory, `./${entryName}/${import_constants.ENTRY_POINT_RUNTIME_GLOBAL_CONTEXT_FILE_NAME}.server.js`);
+        await import_utils.fs.outputFile(contextFile2, contextServerCode, "utf8");
+      }
+      const contextFile = import_path.default.resolve(internalDirectory, `./${entryName}/${import_constants.ENTRY_POINT_RUNTIME_GLOBAL_CONTEXT_FILE_NAME}.js`);
+      await import_utils.fs.outputFile(contextFile, contextCode, "utf8");
     }
   }));
 };

package/dist/cjs/cli/constants.js

@@ -36,7 +36,7 @@ const INDEX_FILE_NAME = "index";
 const ENTRY_BOOTSTRAP_FILE_NAME = "bootstrap.jsx";
 const ENTRY_SERVER_BOOTSTRAP_FILE_NAME = "bootstrap.server.jsx";
 const ENTRY_POINT_RUNTIME_REGISTER_FILE_NAME = "runtime-register.js";
-const ENTRY_POINT_RUNTIME_GLOBAL_CONTEXT_FILE_NAME = "runtime-global-context.js";
+const ENTRY_POINT_RUNTIME_GLOBAL_CONTEXT_FILE_NAME = "runtime-global-context";
 const ENTRY_POINT_REGISTER_FILE_NAME = "register.js";
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {

package/dist/cjs/cli/ssr/index.js

@@ -57,13 +57,16 @@ const ssrBuilderPlugin = (modernAPI) => ({
   name: "@modern-js/builder-plugin-ssr",
   setup(api) {
     api.modifyEnvironmentConfig((config, { name, mergeEnvironmentConfig }) => {
+      var _userConfig_deploy_worker, _userConfig_deploy, _userConfig_server;
       const isServerEnvironment = config.output.target === "node" || name === "workerSSR";
       const userConfig = modernAPI.getNormalizedConfig();
+      const ssrEnv = ((_userConfig_deploy = userConfig.deploy) === null || _userConfig_deploy === void 0 ? void 0 : (_userConfig_deploy_worker = _userConfig_deploy.worker) === null || _userConfig_deploy_worker === void 0 ? void 0 : _userConfig_deploy_worker.ssr) || ((_userConfig_server = userConfig.server) === null || _userConfig_server === void 0 ? void 0 : _userConfig_server.rsc) ? "edge" : "node";
       const useLoadablePlugin = (0, import_utils.isUseSSRBundle)(userConfig) && !isServerEnvironment && checkUseStringSSR(userConfig);
       return mergeEnvironmentConfig(config, {
         source: {
           define: {
-            "process.env.MODERN_TARGET": isServerEnvironment ? JSON.stringify("node") : JSON.stringify("browser")
+            "process.env.MODERN_TARGET": isServerEnvironment ? JSON.stringify("node") : JSON.stringify("browser"),
+            "process.env.MODERN_SSR_ENV": JSON.stringify(ssrEnv)
           }
         },
         tools: {

package/dist/cjs/cli/template.js

@@ -28,28 +28,72 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var template_exports = {};
 __export(template_exports, {
+  AppProxyForRSC: () => AppProxyForRSC,
+  entryForCSRWithRSC: () => entryForCSRWithRSC,
   index: () => index,
   register: () => register,
   runtimeGlobalContext: () => runtimeGlobalContext,
+  runtimeGlobalContextForRSCClient: () => runtimeGlobalContextForRSCClient,
+  runtimeGlobalContextForRSCServer: () => runtimeGlobalContextForRSCServer,
   runtimeRegister: () => runtimeRegister
 });
 module.exports = __toCommonJS(template_exports);
 var import_path = __toESM(require("path"));
 var import_utils = require("@modern-js/utils");
 var import_constants = require("./constants");
-const genRenderCode = ({ srcDirectory, internalSrcAlias, metaName, entry, customEntry, customBootstrap, mountId }) => {
+const genRenderCode = ({ srcDirectory, internalSrcAlias, metaName, entry, customEntry, customBootstrap, mountId, enableRsc }) => {
   if (customEntry) {
     return `import '${(0, import_utils.formatImportPath)(entry.replace(srcDirectory, internalSrcAlias))}'`;
   }
   return `import { createRoot } from '@${metaName}/runtime/react';
 import { render } from '@${metaName}/runtime/browser';
+
+${enableRsc ? `import { RscClientRoot, createFromReadableStream, rscStream, callServer } from '@${metaName}/runtime/rsc/client';` : ""}
+
+${enableRsc ? `const data = createFromReadableStream(rscStream, {
+    callServer: callServer,
+  });` : ""}
+
 ${customBootstrap ? `import customBootstrap from '${(0, import_utils.formatImportPath)(customBootstrap.replace(srcDirectory, internalSrcAlias))}';` : ""}
 
+
+
 const ModernRoot = createRoot();
 
-${customBootstrap ? `customBootstrap(ModernRoot, () => render(<ModernRoot />, '${mountId || "root"}'));` : `render(<ModernRoot />, '${mountId || "root"}');`}`;
+${customBootstrap ? `customBootstrap(ModernRoot, () => render(<ModernRoot />, '${mountId || "root"}'));` : enableRsc ? `render(<ModernRoot>
+                  <RscClientRoot data={data} />
+                </ModernRoot>, '${mountId || "root"}');` : `render(<ModernRoot />, '${mountId || "root"}');`}`;
+};
+const entryForCSRWithRSC = ({ metaName, entryName, urlPath = "/", mountId = "root" }) => {
+  return `
+  import '@${metaName}/runtime/registry/${entryName}';
+  import { render } from '@${metaName}/runtime/browser';
+  import { createRoot } from '@${metaName}/runtime/react';
+
+  import {
+    RscClientRoot,
+    createFromFetch
+  } from '@${metaName}/runtime/rsc/client';
+
+  const content = createFromFetch(
+    fetch('${urlPath}', {
+      headers: {
+        'x-rsc-tree': 'true',
+      },
+    }),
+  );
+
+  const ModernRoot = createRoot();
+
+  render(
+    <ModernRoot>
+      <RscClientRoot data={content} />
+    </ModernRoot>,
+    '${mountId}',
+  );
+  `;
 };
-const index = ({ srcDirectory, internalSrcAlias, metaName, entry, entryName, customEntry, customBootstrap, mountId }) => `import '@${metaName}/runtime/registry/${entryName}';
+const index = ({ srcDirectory, internalSrcAlias, metaName, entry, entryName, customEntry, customBootstrap, mountId, enableRsc }) => `import '@${metaName}/runtime/registry/${entryName}';
 ${genRenderCode({
   srcDirectory,
   internalSrcAlias,
@@ -57,7 +101,8 @@ ${genRenderCode({
   entry,
   customEntry,
   customBootstrap,
-  mountId
+  mountId,
+  enableRsc
 })}
 `;
 const register = () => `import './${import_constants.ENTRY_POINT_RUNTIME_GLOBAL_CONTEXT_FILE_NAME}';
@@ -95,10 +140,52 @@ setGlobalContext({
   App,
 });`;
 };
+const runtimeGlobalContextForRSCServer = ({ metaName }) => {
+  return `
+  import { createElement, Fragment } from 'react';
+  import { setGlobalContext } from '@${metaName}/runtime/context';
+  import AppProxy from './AppProxy';
+
+  const DefaultRoot = ({ children }: { children?: ReactNode }) =>
+    createElement(Fragment, null, children);
+
+
+  setGlobalContext({
+    App: DefaultRoot,
+    RSCRoot: AppProxy,
+  });`;
+};
+const runtimeGlobalContextForRSCClient = ({ metaName }) => {
+  return `
+  import { createElement, Fragment } from 'react';
+  import { setGlobalContext } from '@${metaName}/runtime/context';
+
+  const DefaultRoot = ({ children }: { children?: ReactNode }) =>
+    createElement(Fragment, null, children);
+
+  setGlobalContext({
+    App: DefaultRoot
+  });`;
+};
+const AppProxyForRSC = ({ srcDirectory, internalSrcAlias, entry, customEntry }) => {
+  return `
+  import App from '${// We need to get the path of App.tsx here, but the entry is `src/entry.tsx`
+  (0, import_utils.formatImportPath)(customEntry ? entry.replace(/entry\.[tj]sx/, "App").replace(srcDirectory, internalSrcAlias) : entry.replace(srcDirectory, internalSrcAlias).replace(".tsx", ""))}';
+  import React from 'react';
+
+  export default function Root() {
+    return React.createElement(App, null);
+  }
+  `;
+};
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
+  AppProxyForRSC,
+  entryForCSRWithRSC,
   index,
   register,
   runtimeGlobalContext,
+  runtimeGlobalContextForRSCClient,
+  runtimeGlobalContextForRSCServer,
   runtimeRegister
 });

package/dist/cjs/cli/template.server.js

@@ -18,6 +18,7 @@ var __copyProps = (to, from, except, desc) => {
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var template_server_exports = {};
 __export(template_server_exports, {
+  entryForCSRWithRSC: () => entryForCSRWithRSC,
   serverIndex: () => serverIndex
 });
 module.exports = __toCommonJS(template_server_exports);
@@ -42,6 +43,38 @@ const handleRequest = async (request, ServerRoot, options) => {
 
 export const requestHandler = createRequestHandler(handleRequest);
 `;
+const SERVER_ENTRY_RSC = `
+import {
+  renderStreaming,
+  createRequestHandler,
+} from '@#metaName/runtime/ssr/server';
+import { RSCServerSlot } from '@#metaName/runtime/rsc/client';
+export { handleAction } from '@#metaName/runtime/rsc/server';
+
+const handleRequest = async (request, ServerRoot, options) => {
+
+  const body = await renderStreaming(request,
+    <ServerRoot>
+      <RSCServerSlot />
+    </ServerRoot>,
+    {
+      ...options,
+      rscRoot: <options.RSCRoot />,
+    },
+  );
+
+  return new Response(body, {
+    headers: {
+      'content-type': 'text/html; charset=utf-8',
+      #headers
+    },
+  })
+};
+
+export const requestHandler = createRequestHandler(handleRequest, {
+  enableRsc: true,
+});
+`;
 const serverIndex = (options) => {
   const { metaName = "modern-js", entryName } = options;
   return `
@@ -49,11 +82,39 @@ const serverIndex = (options) => {
     ${genHandlerCode(options)}
   `;
 };
-function genHandlerCode({ mode, metaName, customServerEntry, srcDirectory, internalSrcAlias }) {
+const entryForCSRWithRSC = ({ metaName }) => {
+  return `
+  import App from './AppProxy';
+  import { renderRsc } from '@${metaName}/runtime/rsc/server'
+  export { handleAction } from '@${metaName}/runtime/rsc/server';
+
+
+  export const rscRequestHandler = ({
+    clientManifest
+  }) => {
+    const stream = renderRsc({
+      element: <App/>,
+      clientManifest,
+    })
+
+    const response = new Response(stream, {
+      headers: {
+        'Transfer-Encoding': 'chunked',
+      },
+    });
+    return response
+  }
+`;
+};
+function genHandlerCode({ mode, metaName, customServerEntry, srcDirectory, internalSrcAlias, enableRsc }) {
   if (customServerEntry) {
-    return `export { default as requestHandler } from '${(0, import_utils.formatImportPath)(customServerEntry.replace(srcDirectory, internalSrcAlias))}'`;
+    const realEntryPath = (0, import_utils.formatImportPath)(customServerEntry.replace(srcDirectory, internalSrcAlias));
+    return `
+      export * from '${realEntryPath}';
+      export { default as requestHandler } from '${realEntryPath}'`;
   } else {
-    const serverEntry = transformServerEntry(SERVER_ENTRY, {
+    const entrySource = enableRsc ? SERVER_ENTRY_RSC : SERVER_ENTRY;
+    const serverEntry = transformServerEntry(entrySource, {
       metaName: metaName || "modern-js",
       mode
     });
@@ -67,5 +128,6 @@ function transformServerEntry(source, options) {
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
+  entryForCSRWithRSC,
   serverIndex
 });

package/dist/cjs/core/context/index.js

@@ -24,6 +24,7 @@ __export(context_exports, {
   getGlobalAppInit: () => getGlobalAppInit,
   getGlobalInternalRuntimeContext: () => getGlobalInternalRuntimeContext,
   getGlobalLayoutApp: () => getGlobalLayoutApp,
+  getGlobalRSCRoot: () => getGlobalRSCRoot,
   getGlobalRoutes: () => getGlobalRoutes,
   getInitialContext: () => import_runtime.getInitialContext,
   setGlobalContext: () => setGlobalContext,
@@ -38,6 +39,10 @@ function setGlobalContext(context) {
   globalContext.appInit = context.appInit;
   globalContext.appConfig = typeof context.appConfig === "function" ? context.appConfig() : context.appConfig;
   globalContext.layoutApp = context.layoutApp;
+  globalContext.RSCRoot = context.RSCRoot;
+}
+function getGlobalRSCRoot() {
+  return globalContext.RSCRoot;
 }
 function setGlobalInternalRuntimeContext(context) {
   globalContext.internalRuntimeContext = context;
@@ -70,6 +75,7 @@ function getGlobalLayoutApp() {
   getGlobalAppInit,
   getGlobalInternalRuntimeContext,
   getGlobalLayoutApp,
+  getGlobalRSCRoot,
   getGlobalRoutes,
   getInitialContext,
   setGlobalContext,

package/dist/cjs/core/server/requestHandler.js

@@ -27,6 +27,7 @@ var import_runtime = require("../context/runtime");
 var import_loaderManager = require("../loader/loaderManager");
 var import_react = require("../react");
 var import_constants = require("./constants");
+var import_tracer = require("./tracer");
 var import_utils = require("./utils");
 function createSSRContext(request, options) {
   const { config, loaderContext, onError, onTiming, locals, resource, params, responseProxy, logger, metrics, reporter } = options;
@@ -84,9 +85,9 @@ function createSSRContext(request, options) {
     loaderFailureMode
   };
 }
-const createRequestHandler = async (handleRequest) => {
+const createRequestHandler = async (handleRequest, createRequestOptions) => {
   const requestHandler = async (request, options) => {
-    var _context_routerContext, _context_routerContext1;
+    var _context_routerContext, _context_routerContext1, _context_routerContext2;
     const Root = (0, import_react.createRoot)();
     const internalRuntimeContext = (0, import_context.getGlobalInternalRuntimeContext)();
     const hooks = internalRuntimeContext.hooks;
@@ -136,8 +137,12 @@ const createRequestHandler = async (handleRequest) => {
     };
     const initialData = await runBeforeRender(context);
     if (((_context_routerContext = context.routerContext) === null || _context_routerContext === void 0 ? void 0 : _context_routerContext.statusCode) && ((_context_routerContext1 = context.routerContext) === null || _context_routerContext1 === void 0 ? void 0 : _context_routerContext1.statusCode) !== 200) {
-      var _context_routerContext2, _context_ssrContext;
-      (_context_ssrContext = context.ssrContext) === null || _context_ssrContext === void 0 ? void 0 : _context_ssrContext.response.status((_context_routerContext2 = context.routerContext) === null || _context_routerContext2 === void 0 ? void 0 : _context_routerContext2.statusCode);
+      var _context_routerContext3, _context_ssrContext;
+      (_context_ssrContext = context.ssrContext) === null || _context_ssrContext === void 0 ? void 0 : _context_ssrContext.response.status((_context_routerContext3 = context.routerContext) === null || _context_routerContext3 === void 0 ? void 0 : _context_routerContext3.statusCode);
+    }
+    const errors = Object.values(((_context_routerContext2 = context.routerContext) === null || _context_routerContext2 === void 0 ? void 0 : _context_routerContext2.errors) || {});
+    if (errors.length > 0) {
+      options.onError(errors[0], import_tracer.SSRErrors.LOADER_ERROR);
     }
     context.initialData = initialData;
     const redirectResponse = getRedirectResponse(initialData);
@@ -148,7 +153,8 @@ const createRequestHandler = async (handleRequest) => {
     options.resource.htmlTemplate = htmlTemplate.replace("</head>", `${import_constants.CHUNK_CSS_PLACEHOLDER}</head>`);
     const response = await handleRequest(request, Root, {
       ...options,
-      runtimeContext: context
+      runtimeContext: context,
+      RSCRoot: (createRequestOptions === null || createRequestOptions === void 0 ? void 0 : createRequestOptions.enableRsc) && (0, import_context.getGlobalRSCRoot)()
     });
     Object.entries(responseProxy.headers).forEach(([key, value]) => {
       response.headers.set(key, value);

package/dist/cjs/core/server/stream/afterTemplate.js

@@ -42,6 +42,8 @@ function buildShellAfterTemplate(afterAppTemplate, options) {
   async function injectJs(template, entryName2, nonce) {
     const { routeManifest } = runtimeContext;
     const { routeAssets } = routeManifest;
+    if (!routeAssets)
+      return template;
     const asyncEntry = routeAssets[`async-${entryName2}`];
     if (asyncEntry) {
       var _assets_filter;

package/dist/cjs/core/server/stream/createReadableStream.worker.js

@@ -31,8 +31,8 @@ __export(createReadableStream_worker_exports, {
   createReadableStreamFromElement: () => createReadableStreamFromElement
 });
 module.exports = __toCommonJS(createReadableStream_worker_exports);
+var import_ssr = require("@modern-js/render/ssr");
 var import_isbot = __toESM(require("isbot"));
-var import_server = require("react-dom/server");
 var import_common = require("../../../common");
 var import_constants = require("../../constants");
 var import_shared = require("./shared");
@@ -40,7 +40,7 @@ var import_template = require("./template");
 const createReadableStreamFromElement = async (request, rootElement, options) => {
   let shellChunkStatus = import_shared.ShellChunkStatus.START;
   const chunkVec = [];
-  const { htmlTemplate, runtimeContext, config, ssrConfig, entryName } = options;
+  const { htmlTemplate, runtimeContext, config, ssrConfig, entryName, rscRoot } = options;
   const { shellBefore, shellAfter } = await (0, import_template.getTemplates)(htmlTemplate, {
     renderLevel: import_constants.RenderLevel.SERVER_RENDER,
     runtimeContext,
@@ -51,8 +51,12 @@ const createReadableStreamFromElement = async (request, rootElement, options) =>
   });
   try {
     var _options_onShellReady;
-    const readableOriginal = await (0, import_server.renderToReadableStream)(rootElement, {
+    const readableOriginal = await (0, import_ssr.renderSSRStream)(rootElement, {
+      request,
+      clientManifest: options.rscClientManifest,
+      ssrManifest: options.rscSSRManifest,
       nonce: config.nonce,
+      rscRoot,
       onError(error) {
         var _options_onError;
         (_options_onError = options.onError) === null || _options_onError === void 0 ? void 0 : _options_onError.call(options, error);
@@ -80,7 +84,7 @@ const createReadableStreamFromElement = async (request, rootElement, options) =>
             const chunk = new TextDecoder().decode(value);
             chunkVec.push(chunk);
             let concatedChunk = chunkVec.join("");
-            if (concatedChunk.endsWith(import_common.ESCAPED_SHELL_STREAM_END_MARK)) {
+            if (concatedChunk.includes(import_common.ESCAPED_SHELL_STREAM_END_MARK)) {
               concatedChunk = concatedChunk.replace(import_common.ESCAPED_SHELL_STREAM_END_MARK, "");
               shellChunkStatus = import_shared.ShellChunkStatus.FINISH;
               controller.enqueue((0, import_shared.encodeForWebStream)(`${shellBefore}${concatedChunk}${shellAfter}`));

package/dist/cjs/core/server/stream/index.js

@@ -1,7 +1,9 @@
 "use strict";
+var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __export = (target, all) => {
   for (var name in all)
@@ -15,15 +17,23 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var stream_exports = {};
 __export(stream_exports, {
   renderStreaming: () => renderStreaming
 });
 module.exports = __toCommonJS(stream_exports);
-var import_createReadableStream = require("./createReadableStream");
 var import_shared = require("./shared");
-const renderStreaming = (0, import_shared.createRenderStreaming)(import_createReadableStream.createReadableStreamFromElement);
+const createReadableStreamFromElement = process.env.MODERN_SSR_ENV === "edge" ? Promise.resolve().then(() => __toESM(require("./createReadableStream.worker"))).then((m) => m.createReadableStreamFromElement) : Promise.resolve().then(() => __toESM(require("./createReadableStream"))).then((m) => m.createReadableStreamFromElement);
+const renderStreaming = (0, import_shared.createRenderStreaming)(createReadableStreamFromElement);
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   renderStreaming

package/dist/cjs/core/server/stream/shared.js

@@ -24,6 +24,7 @@ __export(shared_exports, {
   getReadableStreamFromString: () => getReadableStreamFromString
 });
 module.exports = __toCommonJS(shared_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
 var import_node = require("@modern-js/runtime-utils/node");
 var import_time = require("@modern-js/runtime-utils/time");
 var import_request = require("@modern-js/runtime-utils/universal/request");
@@ -54,25 +55,37 @@ function getReadableStreamFromString(content) {
   });
   return readableStream;
 }
-function createRenderStreaming(createReadableStreamFromElement) {
+function createRenderStreaming(createReadableStreamPromise) {
   return async (request, serverRoot, options) => {
+    const createReadableStreamFromElement = await createReadableStreamPromise;
     const headersData = (0, import_request.parseHeaders)(request);
     return (0, import_node.run)(headersData, async () => {
       const end = (0, import_time.time)();
       const { runtimeContext, config, resource } = options;
-      const onError = (0, import_tracer.createOnError)(options.onError);
-      const onTiming = (0, import_tracer.createOnTiming)(options.onTiming);
+      const { onError, onTiming } = options;
       const { htmlTemplate, entryName } = resource;
       const ssrConfig = (0, import_utils.getSSRConfigByEntry)(entryName, config.ssr, config.ssrByEntries);
-      const rootElement = (0, import_wrapper.wrapRuntimeContextProvider)(serverRoot, Object.assign(runtimeContext, {
+      const RSCServerRoot = ({ children }) => {
+        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, {
+          children
+        });
+      };
+      let rootElement = (0, import_wrapper.wrapRuntimeContextProvider)(serverRoot, Object.assign(runtimeContext, {
         ssr: true
       }));
+      rootElement = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(RSCServerRoot, {
+        children: rootElement
+      });
       const stream = await createReadableStreamFromElement(request, rootElement, {
         config,
         htmlTemplate,
         runtimeContext,
         ssrConfig,
         entryName,
+        rscClientManifest: options.rscClientManifest,
+        rscSSRManifest: options.rscSSRManifest,
+        rscServerManifest: options.rscServerManifest,
+        rscRoot: options.rscRoot,
         onShellReady() {
           const cost = end();
           onTiming(import_tracer.SSRTimings.RENDER_SHELL, cost);
@@ -82,10 +95,10 @@ function createRenderStreaming(createReadableStreamFromElement) {
           onTiming(import_tracer.SSRTimings.RENDER_HTML, cost);
         },
         onShellError(error) {
-          onError(import_tracer.SSRErrors.RENDER_SHELL, error);
+          onError(error, import_tracer.SSRErrors.RENDER_SHELL);
         },
         onError(error) {
-          onError(import_tracer.SSRErrors.RENDER_STREAM, error);
+          onError(error, import_tracer.SSRErrors.RENDER_STREAM);
         }
       });
       return stream;

package/dist/cjs/core/server/string/index.js

@@ -53,8 +53,8 @@ const renderString = async (request, serverRoot, options) => {
     var _runtimeContext_ssrContext;
     const { resource, runtimeContext, config, onError, onTiming } = options;
     const tracer = {
-      onError: (0, import_tracer.createOnError)(onError),
-      onTiming: (0, import_tracer.createOnTiming)(onTiming)
+      onError,
+      onTiming
     };
     const routerContext = runtimeContext.routerContext;
     const { htmlTemplate, entryName, loadableStats, routeManifest } = resource;
@@ -71,7 +71,7 @@ const renderString = async (request, serverRoot, options) => {
       chunkSet.renderLevel = import_constants.RenderLevel.SERVER_PREFETCH;
     } catch (e) {
       chunkSet.renderLevel = import_constants.RenderLevel.CLIENT_RENDER;
-      tracer.onError(import_tracer.SSRErrors.PRERENDER, e);
+      tracer.onError(e, import_tracer.SSRErrors.PRERENDER);
     }
     const collectors = [
       new import_styledComponent.StyledCollector(chunkSet),
@@ -120,7 +120,7 @@ async function generateHtml(App, htmlTemplate, chunkSet, collectors, htmlModifie
     onTiming(import_tracer.SSRTimings.RENDER_HTML, cost);
   } catch (e) {
     chunkSet.renderLevel = import_constants.RenderLevel.CLIENT_RENDER;
-    onError(import_tracer.SSRErrors.RENDER_HTML, e);
+    onError(e, import_tracer.SSRErrors.RENDER_HTML);
   }
   await Promise.all(collectors.map((component) => component.effect()));
   const { ssrScripts, cssChunk, jsChunk } = chunkSet;