diff --git a/packages/react-dom-bindings/src/server/ReactDOMFloatServer.js b/packages/react-dom-bindings/src/server/ReactDOMFloatServer.js
index e8aecf06c1550..320bb1ef7c551 100644
--- a/packages/react-dom-bindings/src/server/ReactDOMFloatServer.js
+++ b/packages/react-dom-bindings/src/server/ReactDOMFloatServer.js
@@ -108,6 +108,7 @@ type BaseResource = {
   flushed: boolean,
 };
 
+export type LinkTagResource = PreloadResource | StyleResource | LinkResource;
 export type Resource = PreloadResource | StyleResource | ScriptResource;
 export type HeadResource =
   | TitleResource
diff --git a/packages/react-dom-bindings/src/server/ReactDOMServerExternalRuntime.js b/packages/react-dom-bindings/src/server/ReactDOMServerExternalRuntime.js
index 830db39970308..3b55c8f2ef3ef 100644
--- a/packages/react-dom-bindings/src/server/ReactDOMServerExternalRuntime.js
+++ b/packages/react-dom-bindings/src/server/ReactDOMServerExternalRuntime.js
@@ -10,17 +10,12 @@
 import {
   clientRenderBoundary,
   completeBoundaryWithStyles,
+  completeContainerWithStyles,
   completeBoundary,
+  completeContainer,
   completeSegment,
 } from './fizz-instruction-set/ReactDOMFizzInstructionSetExternalRuntime';
 
-if (!window.$RC) {
-  // TODO: Eventually remove, we currently need to set these globals for
-  // compatibility with ReactDOMFizzInstructionSet
-  window.$RC = completeBoundary;
-  window.$RM = new Map();
-}
-
 if (document.readyState === 'loading') {
   if (document.body != null) {
     installFizzInstrObserver(document.body);
@@ -74,34 +69,47 @@ function installFizzInstrObserver(target /*: Node */) {
 }
 
 function handleNode(node_ /*: Node */) {
-  // $FlowFixMe[incompatible-cast]
-  if (node_.nodeType !== 1 || !(node_ /*: HTMLElement*/).dataset) {
+  if (
+    node_.nodeType !== 1 ||
+    // $FlowFixMe[incompatible-cast]
+    !(node_ /*: HTMLElement*/).dataset
+  ) {
     return;
   }
   // $FlowFixMe[incompatible-cast]
   const node = (node_ /*: HTMLElement*/);
   const dataset = node.dataset;
-  if (dataset['rxi'] != null) {
-    clientRenderBoundary(
-      dataset['bid'],
+
+  if (dataset['ix'] != null) {
+    node.remove();
+    return clientRenderBoundary(
+      dataset['ix'],
       dataset['dgst'],
       dataset['msg'],
       dataset['stck'],
     );
+  } else if (dataset['is'] != null) {
+    node.remove();
+    return completeSegment(dataset['is'], dataset['p']);
+  } else if (dataset['ir'] != null) {
     node.remove();
-  } else if (dataset['rri'] != null) {
-    // Convert styles here, since its type is Array<Array<string>>
-    completeBoundaryWithStyles(
-      dataset['bid'],
-      dataset['sid'],
-      JSON.parse(dataset['sty']),
+    return completeBoundaryWithStyles(
+      dataset['ir'],
+      dataset['s'],
+      JSON.parse(dataset['r']),
     );
+  } else if (dataset['ib'] != null) {
     node.remove();
-  } else if (dataset['rci'] != null) {
-    completeBoundary(dataset['bid'], dataset['sid']);
+    return completeBoundary(dataset['ib'], dataset['s']);
+  } else if (dataset['ik'] != null) {
     node.remove();
-  } else if (dataset['rsi'] != null) {
-    completeSegment(dataset['sid'], dataset['pid']);
+    return completeContainerWithStyles(
+      dataset['ik'],
+      dataset['s'],
+      JSON.parse(dataset['r']),
+    );
+  } else if (dataset['ic'] != null) {
     node.remove();
+    return completeContainer(dataset['ic'], dataset['s']);
   }
 }
diff --git a/packages/react-dom-bindings/src/server/ReactDOMServerFormatConfig.js b/packages/react-dom-bindings/src/server/ReactDOMServerFormatConfig.js
index 921424e852e3f..a2cfe93023e8e 100644
--- a/packages/react-dom-bindings/src/server/ReactDOMServerFormatConfig.js
+++ b/packages/react-dom-bindings/src/server/ReactDOMServerFormatConfig.js
@@ -8,7 +8,11 @@
  */
 
 import type {ReactNodeList} from 'shared/ReactTypes';
-import type {Resources, BoundaryResources} from './ReactDOMFloatServer';
+import type {
+  Resources,
+  BoundaryResources,
+  LinkTagResource,
+} from './ReactDOMFloatServer';
 export type {Resources, BoundaryResources};
 
 import {
@@ -80,10 +84,11 @@ export {
 } from './ReactDOMFloatServer';
 
 import {
-  clientRenderBoundary as clientRenderFunction,
-  completeBoundary as completeBoundaryFunction,
-  completeBoundaryWithStyles as styleInsertionFunction,
-  completeSegment as completeSegmentFunction,
+  clientRenderBoundary as clientRenderFunctionString,
+  completeBoundary as completeBoundaryFunctionString,
+  completeContainer as completeContainerFunctionString,
+  completeBoundaryWithStyles as styleInsertionFunctionString,
+  completeSegment as completeSegmentFunctionString,
 } from './fizz-instruction-set/ReactDOMFizzInstructionSetInlineCodeStrings';
 
 import ReactDOMSharedInternals from 'shared/ReactDOMSharedInternals';
@@ -117,6 +122,7 @@ const DataStreamingFormat: StreamingFormat = 1;
 // Per response, global state that is not contextual to the rendering subtree.
 export type ResponseState = {
   bootstrapChunks: Array<Chunk | PrecomputedChunk>,
+  fallbackBootstrapChunks: void | Array<Chunk | PrecomputedChunk>,
   placeholderPrefix: PrecomputedChunk,
   segmentPrefix: PrecomputedChunk,
   boundaryPrefix: string,
@@ -127,6 +133,7 @@ export type ResponseState = {
   startInlineScript: PrecomputedChunk,
   sentCompleteSegmentFunction: boolean,
   sentCompleteBoundaryFunction: boolean,
+  sentCompleteContainerFunction: boolean,
   sentClientRenderFunction: boolean,
   sentStyleInsertionFunction: boolean,
   // state for data streaming format
@@ -182,6 +189,13 @@ export function createResponseState(
   bootstrapScriptContent: string | void,
   bootstrapScripts: $ReadOnlyArray<string | BootstrapScriptDescriptor> | void,
   bootstrapModules: $ReadOnlyArray<string | BootstrapScriptDescriptor> | void,
+  fallbackBootstrapScriptContent: string | void,
+  fallbackBootstrapScripts: $ReadOnlyArray<
+    string | BootstrapScriptDescriptor,
+  > | void,
+  fallbackBootstrapModules: $ReadOnlyArray<
+    string | BootstrapScriptDescriptor,
+  > | void,
   externalRuntimeConfig: string | BootstrapScriptDescriptor | void,
 ): ResponseState {
   const idPrefix = identifierPrefix === undefined ? '' : identifierPrefix;
@@ -259,8 +273,66 @@ export function createResponseState(
       bootstrapChunks.push(endAsyncScript);
     }
   }
+
+  const fallbackBootstrapChunks = [];
+  if (fallbackBootstrapScriptContent !== undefined) {
+    fallbackBootstrapChunks.push(
+      inlineScriptWithNonce,
+      stringToChunk(
+        escapeBootstrapScriptContent(fallbackBootstrapScriptContent),
+      ),
+      endInlineScript,
+    );
+  }
+  // We intentionally omit the rizz runtime for fallback bootstrap even if configured.
+  // Even if it is configured the fallback bootstrap only executes if React errors at some Root
+  // Boundary and in these cases there will be no instructions for the runtime to execute
+  if (fallbackBootstrapScripts !== undefined) {
+    for (let i = 0; i < fallbackBootstrapScripts.length; i++) {
+      const scriptConfig = fallbackBootstrapScripts[i];
+      const src =
+        typeof scriptConfig === 'string' ? scriptConfig : scriptConfig.src;
+      const integrity =
+        typeof scriptConfig === 'string' ? undefined : scriptConfig.integrity;
+      fallbackBootstrapChunks.push(
+        startScriptSrc,
+        stringToChunk(escapeTextForBrowser(src)),
+      );
+      if (integrity) {
+        fallbackBootstrapChunks.push(
+          scriptIntegirty,
+          stringToChunk(escapeTextForBrowser(integrity)),
+        );
+      }
+      fallbackBootstrapChunks.push(endAsyncScript);
+    }
+  }
+  if (fallbackBootstrapModules !== undefined) {
+    for (let i = 0; i < fallbackBootstrapModules.length; i++) {
+      const scriptConfig = fallbackBootstrapModules[i];
+      const src =
+        typeof scriptConfig === 'string' ? scriptConfig : scriptConfig.src;
+      const integrity =
+        typeof scriptConfig === 'string' ? undefined : scriptConfig.integrity;
+      fallbackBootstrapChunks.push(
+        startModuleSrc,
+        stringToChunk(escapeTextForBrowser(src)),
+      );
+      if (integrity) {
+        fallbackBootstrapChunks.push(
+          scriptIntegirty,
+          stringToChunk(escapeTextForBrowser(integrity)),
+        );
+      }
+      fallbackBootstrapChunks.push(endAsyncScript);
+    }
+  }
+
   return {
     bootstrapChunks: bootstrapChunks,
+    fallbackBootstrapChunks: fallbackBootstrapChunks.length
+      ? fallbackBootstrapChunks
+      : undefined,
     placeholderPrefix: stringToPrecomputedChunk(idPrefix + 'P:'),
     segmentPrefix: stringToPrecomputedChunk(idPrefix + 'S:'),
     boundaryPrefix: idPrefix + 'B:',
@@ -270,6 +342,7 @@ export function createResponseState(
     startInlineScript: inlineScriptWithNonce,
     sentCompleteSegmentFunction: false,
     sentCompleteBoundaryFunction: false,
+    sentCompleteContainerFunction: false,
     sentClientRenderFunction: false,
     sentStyleInsertionFunction: false,
     externalRuntimeConfig: externalRuntimeDesc,
@@ -415,6 +488,10 @@ export function assignSuspenseBoundaryID(
   );
 }
 
+export function createRootBoundaryID(containerID: string): SuspenseBoundaryID {
+  return stringToPrecomputedChunk(containerID);
+}
+
 export function makeId(
   responseState: ResponseState,
   treeId: string,
@@ -2126,6 +2203,24 @@ export function writeCompletedRoot(
   return true;
 }
 
+export function writeErroredRoot(
+  destination: Destination,
+  responseState: ResponseState,
+): boolean {
+  // If fallback bootstrap scripts were provided and we errored at the Root Boundary
+  // then use those. Use the normal bootstrapChunks if no fallbacks were provided
+  const bootstrapChunks =
+    responseState.fallbackBootstrapChunks || responseState.bootstrapChunks;
+  let i = 0;
+  for (; i < bootstrapChunks.length - 1; i++) {
+    writeChunk(destination, bootstrapChunks[i]);
+  }
+  if (i < bootstrapChunks.length) {
+    return writeChunkAndReturn(destination, bootstrapChunks[i]);
+  }
+  return true;
+}
+
 // Structural Nodes
 
 // A placeholder is a node inside a hidden partial tree that can be filled in later, but before
@@ -2408,16 +2503,29 @@ export function writeEndSegment(
 }
 
 const completeSegmentScript1Full = stringToPrecomputedChunk(
-  completeSegmentFunction + ';$RS("',
+  completeSegmentFunctionString + '$RS("',
 );
 const completeSegmentScript1Partial = stringToPrecomputedChunk('$RS("');
 const completeSegmentScript2 = stringToPrecomputedChunk('","');
 const completeSegmentScriptEnd = stringToPrecomputedChunk('")</script>');
 
-const completeSegmentData1 = stringToPrecomputedChunk(
-  '<template data-rsi="" data-sid="',
-);
-const completeSegmentData2 = stringToPrecomputedChunk('" data-pid="');
+/**
+ * Instrucntion enconding legend
+ *
+ * is = complete segment instruction (segmentID)
+ * ix = client render boundaryinstrunction (boundaryID)
+ * ib = complete boundary instruction (boundaryID)
+ * ir = complete boundary with styles insertion instruction (boundaryID)
+ * ic = complete container instruction (containerID)
+ * ik = complete container with styles insertion instruction (containerID)
+ *
+ * s = segmentID
+ * p = placeholderID
+ * r = styles JSON string
+ */
+
+const completeSegmentData1 = stringToPrecomputedChunk('<template data-is="');
+const completeSegmentData2 = stringToPrecomputedChunk('" data-p="');
 const completeSegmentDataEnd = dataElementQuotedEnd;
 
 export function writeCompletedSegmentInstruction(
@@ -2461,34 +2569,47 @@ export function writeCompletedSegmentInstruction(
   }
 }
 
-const completeBoundaryScript1Full = stringToPrecomputedChunk(
-  completeBoundaryFunction + ';$RC("',
+const completeBoundaryFunction = stringToPrecomputedChunk(
+  completeBoundaryFunctionString,
+);
+const completeContainerFunction = stringToPrecomputedChunk(
+  completeContainerFunctionString,
+);
+const styleInsertionFunction = stringToPrecomputedChunk(
+  styleInsertionFunctionString,
 );
-const completeBoundaryScript1Partial = stringToPrecomputedChunk('$RC("');
 
-const completeBoundaryWithStylesScript1FullBoth = stringToPrecomputedChunk(
-  completeBoundaryFunction + ';' + styleInsertionFunction + ';$RR("',
+const completeBoundaryScript1 = stringToPrecomputedChunk('$RC("');
+const completeBoundaryWithStylesScript1 = stringToPrecomputedChunk('$RR($RC,"');
+
+const completeContainerScript1 = stringToPrecomputedChunk('$RK("');
+const completeContainerWithStylesScript1 = stringToPrecomputedChunk(
+  '$RR($RK,"',
 );
-const completeBoundaryWithStylesScript1FullPartial = stringToPrecomputedChunk(
-  styleInsertionFunction + ';$RR("',
+const completeBoundaryOrContainerScript2 = stringToPrecomputedChunk('","');
+const completeBoundaryOrContainerScript2a = stringToPrecomputedChunk('",');
+const completeBoundaryOrContainerScript3 = stringToPrecomputedChunk('"');
+const completeBoundaryOrContainerScriptEnd = stringToPrecomputedChunk(
+  ')</script>',
 );
-const completeBoundaryWithStylesScript1Partial = stringToPrecomputedChunk(
-  '$RR("',
+
+const bootstrapContainerOpenStart = stringToPrecomputedChunk(
+  '<template id="bs:',
 );
-const completeBoundaryScript2 = stringToPrecomputedChunk('","');
-const completeBoundaryScript3a = stringToPrecomputedChunk('",');
-const completeBoundaryScript3b = stringToPrecomputedChunk('"');
-const completeBoundaryScriptEnd = stringToPrecomputedChunk(')</script>');
+const bootstrapContainerOpenEnd = stringToPrecomputedChunk('">');
+const bootstrapContainerClose = stringToPrecomputedChunk('</template>');
 
-const completeBoundaryData1 = stringToPrecomputedChunk(
-  '<template data-rci="" data-bid="',
+const completeContainerData1 = stringToPrecomputedChunk('<template data-ic="');
+const completeContainerWithStylesData1 = stringToPrecomputedChunk(
+  '<template data-ik="',
 );
+const completeBoundaryData1 = stringToPrecomputedChunk('<template data-ib="');
 const completeBoundaryWithStylesData1 = stringToPrecomputedChunk(
-  '<template data-rri="" data-bid="',
+  '<template data-ir="',
 );
-const completeBoundaryData2 = stringToPrecomputedChunk('" data-sid="');
-const completeBoundaryData3a = stringToPrecomputedChunk('" data-sty="');
-const completeBoundaryDataEnd = dataElementQuotedEnd;
+const completeBoundaryOrContainerData2 = stringToPrecomputedChunk('" data-s="');
+const completeBoundaryOrContainerData3 = stringToPrecomputedChunk('" data-r="');
+const completeBoundaryOrContainerDataEmptyEnd = dataElementQuotedEnd;
 
 export function writeCompletedBoundaryInstruction(
   destination: Destination,
@@ -2497,98 +2618,246 @@ export function writeCompletedBoundaryInstruction(
   contentSegmentID: number,
   boundaryResources: BoundaryResources,
 ): boolean {
+  if (boundaryID === null) {
+    throw new Error(
+      'An ID must have been assigned before we can complete the boundary.',
+    );
+  }
   let hasStyleDependencies;
   if (enableFloat) {
     hasStyleDependencies = hasStyleResourceDependencies(boundaryResources);
   }
+  const formattedContentID = stringToChunk(contentSegmentID.toString(16));
   const scriptFormat =
     !enableFizzExternalRuntime ||
     responseState.streamingFormat === ScriptStreamingFormat;
   if (scriptFormat) {
-    writeChunk(destination, responseState.startInlineScript);
     if (enableFloat && hasStyleDependencies) {
+      writeChunk(destination, responseState.startInlineScript);
+      if (!responseState.sentStyleInsertionFunction) {
+        responseState.sentStyleInsertionFunction = true;
+        writeChunk(destination, clonePrecomputedChunk(styleInsertionFunction));
+      }
       if (!responseState.sentCompleteBoundaryFunction) {
         responseState.sentCompleteBoundaryFunction = true;
-        responseState.sentStyleInsertionFunction = true;
-        writeChunk(
-          destination,
-          clonePrecomputedChunk(completeBoundaryWithStylesScript1FullBoth),
-        );
-      } else if (!responseState.sentStyleInsertionFunction) {
-        responseState.sentStyleInsertionFunction = true;
-        writeChunk(destination, completeBoundaryWithStylesScript1FullPartial);
-      } else {
-        writeChunk(destination, completeBoundaryWithStylesScript1Partial);
+        writeChunk(destination, completeBoundaryFunction);
       }
+      writeChunk(destination, completeBoundaryWithStylesScript1);
+      writeChunk(destination, boundaryID);
+      writeChunk(destination, completeBoundaryOrContainerScript2);
+      writeChunk(destination, responseState.segmentPrefix);
+      writeChunk(destination, formattedContentID);
+      writeChunk(destination, completeBoundaryOrContainerScript2a);
+      writeStyleResourceDependenciesInJS(destination, boundaryResources);
+      return writeChunkAndReturn(
+        destination,
+        completeBoundaryOrContainerScriptEnd,
+      );
     } else {
+      writeChunk(destination, responseState.startInlineScript);
       if (!responseState.sentCompleteBoundaryFunction) {
         responseState.sentCompleteBoundaryFunction = true;
-        writeChunk(destination, completeBoundaryScript1Full);
-      } else {
-        writeChunk(destination, completeBoundaryScript1Partial);
+        writeChunk(destination, completeBoundaryFunction);
       }
+      writeChunk(destination, completeBoundaryScript1);
+      writeChunk(destination, boundaryID);
+      writeChunk(destination, completeBoundaryOrContainerScript2);
+      writeChunk(destination, responseState.segmentPrefix);
+      writeChunk(destination, formattedContentID);
+      writeChunk(destination, completeBoundaryOrContainerScript3);
+      return writeChunkAndReturn(
+        destination,
+        completeBoundaryOrContainerScriptEnd,
+      );
     }
   } else {
     if (enableFloat && hasStyleDependencies) {
       writeChunk(destination, completeBoundaryWithStylesData1);
+      writeChunk(destination, boundaryID);
+      writeChunk(destination, completeBoundaryOrContainerData2);
+      writeChunk(destination, responseState.segmentPrefix);
+      writeChunk(destination, formattedContentID);
+      writeChunk(destination, completeBoundaryOrContainerData3);
+      writeStyleResourceDependenciesInAttr(destination, boundaryResources);
+      return writeChunkAndReturn(
+        destination,
+        completeBoundaryOrContainerDataEmptyEnd,
+      );
     } else {
       writeChunk(destination, completeBoundaryData1);
+      writeChunk(destination, boundaryID);
+      writeChunk(destination, completeBoundaryOrContainerData2);
+      writeChunk(destination, responseState.segmentPrefix);
+      writeChunk(destination, formattedContentID);
+      return writeChunkAndReturn(
+        destination,
+        completeBoundaryOrContainerDataEmptyEnd,
+      );
     }
   }
+}
 
+export function writeCompletedRootBoundaryInstruction(
+  destination: Destination,
+  responseState: ResponseState,
+  boundaryID: SuspenseBoundaryID,
+  contentSegmentID: number,
+  boundaryResources: BoundaryResources,
+): boolean {
   if (boundaryID === null) {
     throw new Error(
       'An ID must have been assigned before we can complete the boundary.',
     );
   }
-
-  // Write function arguments, which are string and array literals
+  let hasStyleDependencies;
+  if (enableFloat) {
+    hasStyleDependencies = hasStyleResourceDependencies(boundaryResources);
+  }
   const formattedContentID = stringToChunk(contentSegmentID.toString(16));
-  writeChunk(destination, boundaryID);
+  const scriptFormat =
+    !enableFizzExternalRuntime ||
+    responseState.streamingFormat === ScriptStreamingFormat;
+  let r = true;
   if (scriptFormat) {
-    writeChunk(destination, completeBoundaryScript2);
-  } else {
-    writeChunk(destination, completeBoundaryData2);
-  }
-  writeChunk(destination, responseState.segmentPrefix);
-  writeChunk(destination, formattedContentID);
-  if (enableFloat && hasStyleDependencies) {
-    // Script and data writers must format this differently:
-    //  - script writer emits an array literal, whose string elements are
-    //    escaped for javascript  e.g. ["A", "B"]
-    //  - data writer emits a string literal, which is escaped as html
-    //    e.g. [&#34;A&#34;, &#34;B&#34;]
-    if (scriptFormat) {
-      writeChunk(destination, completeBoundaryScript3a);
-      // boundaryResources encodes an array literal
+    if (enableFloat && hasStyleDependencies) {
+      // We emit the bootstrap chunks into a template container with an id
+      // formed from the root segment ID. The insertion script will inject
+      // the bootstrap scripts into the DOM after revealing the content.
+      // We don't do this for cases where there are no style dependencies because
+      // the content swap is synchronous and will therefore always complete before
+      // the bootstrap scripts run
+      const bootstrapChunks = responseState.bootstrapChunks;
+      if (bootstrapChunks.length) {
+        writeChunk(destination, bootstrapContainerOpenStart);
+        writeChunk(destination, responseState.segmentPrefix);
+        writeChunk(destination, formattedContentID);
+        writeChunk(destination, bootstrapContainerOpenEnd);
+        for (let i = 0; i < bootstrapChunks.length; i++) {
+          writeChunk(destination, bootstrapChunks[i]);
+        }
+        writeChunk(destination, bootstrapContainerClose);
+      }
+
+      writeChunk(destination, responseState.startInlineScript);
+      if (!responseState.sentStyleInsertionFunction) {
+        responseState.sentStyleInsertionFunction = true;
+        writeChunk(destination, clonePrecomputedChunk(styleInsertionFunction));
+      }
+      if (!responseState.sentCompleteContainerFunction) {
+        responseState.sentCompleteContainerFunction = true;
+        writeChunk(destination, completeContainerFunction);
+      }
+      writeChunk(destination, completeContainerWithStylesScript1);
+      writeChunk(destination, boundaryID);
+      writeChunk(destination, completeBoundaryOrContainerScript2);
+      writeChunk(destination, responseState.segmentPrefix);
+      writeChunk(destination, formattedContentID);
+      writeChunk(destination, completeBoundaryOrContainerScript2a);
       writeStyleResourceDependenciesInJS(destination, boundaryResources);
+      return writeChunkAndReturn(
+        destination,
+        completeBoundaryOrContainerScriptEnd,
+      );
     } else {
-      writeChunk(destination, completeBoundaryData3a);
-      writeStyleResourceDependenciesInAttr(destination, boundaryResources);
+      writeChunk(destination, responseState.startInlineScript);
+      if (!responseState.sentCompleteContainerFunction) {
+        responseState.sentCompleteContainerFunction = true;
+        writeChunk(destination, completeContainerFunction);
+      }
+      writeChunk(destination, completeContainerScript1);
+      writeChunk(destination, boundaryID);
+      writeChunk(destination, completeBoundaryOrContainerScript2);
+      writeChunk(destination, responseState.segmentPrefix);
+      writeChunk(destination, formattedContentID);
+      writeChunk(destination, completeBoundaryOrContainerScript3);
+      r = writeChunkAndReturn(
+        destination,
+        completeBoundaryOrContainerScriptEnd,
+      );
+
+      // We emit bootstrap scripts after the completeContainer instruction
+      // because we want to ensure the reveal ocurrs before the bootstrap
+      // scripts execute. Notice that unlike with the styles case the scripts
+      // are not embedded in a template
+      const bootstrapChunks = responseState.bootstrapChunks;
+      let i = 0;
+      for (; i < bootstrapChunks.length - 1; i++) {
+        writeChunk(destination, bootstrapChunks[i]);
+      }
+      if (i < bootstrapChunks.length) {
+        r = writeChunkAndReturn(destination, bootstrapChunks[i]);
+      }
+      return r;
     }
   } else {
-    if (scriptFormat) {
-      writeChunk(destination, completeBoundaryScript3b);
+    if (enableFloat && hasStyleDependencies) {
+      // We emit the bootstrap chunks into a template container with an id
+      // formed from the root segment ID. The insertion script will inject
+      // the bootstrap scripts into the DOM after revealing the content.
+      // We don't do this for cases where there are no style dependencies because
+      // the content swap is synchronous and will therefore always complete before
+      // the bootstrap scripts run
+      const bootstrapChunks = responseState.bootstrapChunks;
+      if (bootstrapChunks.length) {
+        writeChunk(destination, bootstrapContainerOpenStart);
+        writeChunk(destination, responseState.segmentPrefix);
+        writeChunk(destination, formattedContentID);
+        writeChunk(destination, bootstrapContainerOpenEnd);
+        for (let i = 0; i < bootstrapChunks.length; i++) {
+          writeChunk(destination, bootstrapChunks[i]);
+        }
+        writeChunk(destination, bootstrapContainerClose);
+      }
+
+      writeChunk(destination, completeContainerWithStylesData1);
+      writeChunk(destination, boundaryID);
+      writeChunk(destination, completeBoundaryOrContainerData2);
+      writeChunk(destination, responseState.segmentPrefix);
+      writeChunk(destination, formattedContentID);
+      writeChunk(destination, completeBoundaryOrContainerData3);
+      writeStyleResourceDependenciesInAttr(destination, boundaryResources);
+      return writeChunkAndReturn(
+        destination,
+        completeBoundaryOrContainerDataEmptyEnd,
+      );
+    } else {
+      // We emit the bootstrap chunks into a template container with an id
+      // formed from the root segment ID. The insertion script will inject
+      // the bootstrap scripts into the DOM after revealing the content.
+      const bootstrapChunks = responseState.bootstrapChunks;
+      if (bootstrapChunks.length) {
+        writeChunk(destination, bootstrapContainerOpenStart);
+        writeChunk(destination, responseState.segmentPrefix);
+        writeChunk(destination, formattedContentID);
+        writeChunk(destination, bootstrapContainerOpenEnd);
+        for (let i = 0; i < bootstrapChunks.length; i++) {
+          writeChunk(destination, bootstrapChunks[i]);
+        }
+        writeChunk(destination, bootstrapContainerClose);
+      }
+
+      writeChunk(destination, completeContainerData1);
+      writeChunk(destination, boundaryID);
+      writeChunk(destination, completeBoundaryOrContainerData2);
+      writeChunk(destination, responseState.segmentPrefix);
+      writeChunk(destination, formattedContentID);
+      return writeChunkAndReturn(
+        destination,
+        completeBoundaryOrContainerDataEmptyEnd,
+      );
     }
   }
-  if (scriptFormat) {
-    return writeChunkAndReturn(destination, completeBoundaryScriptEnd);
-  } else {
-    return writeChunkAndReturn(destination, completeBoundaryDataEnd);
-  }
 }
 
 const clientRenderScript1Full = stringToPrecomputedChunk(
-  clientRenderFunction + ';$RX("',
+  clientRenderFunctionString + '$RX("',
 );
 const clientRenderScript1Partial = stringToPrecomputedChunk('$RX("');
 const clientRenderScript1A = stringToPrecomputedChunk('"');
 const clientRenderErrorScriptArgInterstitial = stringToPrecomputedChunk(',');
 const clientRenderScriptEnd = stringToPrecomputedChunk(')</script>');
 
-const clientRenderData1 = stringToPrecomputedChunk(
-  '<template data-rxi="" data-bid="',
-);
+const clientRenderData1 = stringToPrecomputedChunk('<template data-ix="');
 const clientRenderData2 = stringToPrecomputedChunk('" data-dgst="');
 const clientRenderData3 = stringToPrecomputedChunk('" data-msg="');
 const clientRenderData4 = stringToPrecomputedChunk('" data-stck="');
@@ -2616,7 +2885,7 @@ export function writeClientRenderBoundaryInstruction(
       writeChunk(destination, clientRenderScript1Partial);
     }
   } else {
-    // <template data-rxi="" data-bid="
+    // <template data-ix="
     writeChunk(destination, clientRenderData1);
   }
 
@@ -2753,13 +3022,13 @@ export function writeInitialResources(
   destination: Destination,
   resources: Resources,
   responseState: ResponseState,
-  willFlushAllSegments: boolean,
+  willEmitInstructions: boolean,
 ): boolean {
   // Write initially discovered resources after the shell completes
   if (
     enableFizzExternalRuntime &&
-    !willFlushAllSegments &&
-    responseState.externalRuntimeConfig
+    responseState.externalRuntimeConfig &&
+    willEmitInstructions
   ) {
     // If the root segment is incomplete due to suspended tasks
     // (e.g. willFlushAllSegments = false) and we are using data
@@ -2769,8 +3038,7 @@ export function writeInitialResources(
     const {src, integrity} = responseState.externalRuntimeConfig;
     preinitImpl(resources, src, {as: 'script', integrity});
   }
-  // $FlowFixMe[missing-local-annot]
-  function flushLinkResource(resource) {
+  function flushLinkResource(resource: LinkTagResource) {
     if (!resource.flushed) {
       pushLinkImpl(target, resource.props, responseState);
       resource.flushed = true;
@@ -2893,9 +3161,19 @@ export function writeImmediateResources(
   destination: Destination,
   resources: Resources,
   responseState: ResponseState,
+  willEmitInstructions: boolean,
 ): boolean {
-  // $FlowFixMe[missing-local-annot]
-  function flushLinkResource(resource) {
+  // Write initially discovered resources after the shell completes
+  if (
+    enableFizzExternalRuntime &&
+    responseState.externalRuntimeConfig &&
+    willEmitInstructions
+  ) {
+    const {src, integrity} = responseState.externalRuntimeConfig;
+    preinitImpl(resources, src, {as: 'script', integrity});
+  }
+
+  function flushLinkResource(resource: LinkTagResource) {
     if (!resource.flushed) {
       pushLinkImpl(target, resource.props, responseState);
       resource.flushed = true;
@@ -2941,8 +3219,7 @@ export function writeImmediateResources(
 
   scripts.forEach(r => {
     // should never be flushed already
-    pushStartGenericElement(target, r.props, 'script', responseState);
-    pushEndInstance(target, target, 'script', r.props);
+    pushScriptImpl(target, r.props, responseState);
     r.flushed = true;
     r.hint.flushed = true;
   });
diff --git a/packages/react-dom-bindings/src/server/ReactDOMServerLegacyFormatConfig.js b/packages/react-dom-bindings/src/server/ReactDOMServerLegacyFormatConfig.js
index aa11451b1eeea..2c2eb8f50bb0d 100644
--- a/packages/react-dom-bindings/src/server/ReactDOMServerLegacyFormatConfig.js
+++ b/packages/react-dom-bindings/src/server/ReactDOMServerLegacyFormatConfig.js
@@ -35,6 +35,7 @@ export const isPrimaryRenderer = false;
 export type ResponseState = {
   // Keep this in sync with ReactDOMServerFormatConfig
   bootstrapChunks: Array<Chunk | PrecomputedChunk>,
+  fallbackBootstrapChunks: void | Array<Chunk | PrecomputedChunk>,
   placeholderPrefix: PrecomputedChunk,
   segmentPrefix: PrecomputedChunk,
   boundaryPrefix: string,
@@ -44,6 +45,7 @@ export type ResponseState = {
   startInlineScript: PrecomputedChunk,
   sentCompleteSegmentFunction: boolean,
   sentCompleteBoundaryFunction: boolean,
+  sentCompleteContainerFunction: boolean,
   sentClientRenderFunction: boolean,
   sentStyleInsertionFunction: boolean,
   externalRuntimeConfig: BootstrapScriptDescriptor | null,
@@ -62,11 +64,15 @@ export function createResponseState(
     undefined,
     undefined,
     undefined,
+    undefined,
+    undefined,
+    undefined,
     externalRuntimeConfig,
   );
   return {
     // Keep this in sync with ReactDOMServerFormatConfig
     bootstrapChunks: responseState.bootstrapChunks,
+    fallbackBootstrapChunks: responseState.fallbackBootstrapChunks,
     placeholderPrefix: responseState.placeholderPrefix,
     segmentPrefix: responseState.segmentPrefix,
     boundaryPrefix: responseState.boundaryPrefix,
@@ -76,6 +82,7 @@ export function createResponseState(
     startInlineScript: responseState.startInlineScript,
     sentCompleteSegmentFunction: responseState.sentCompleteSegmentFunction,
     sentCompleteBoundaryFunction: responseState.sentCompleteBoundaryFunction,
+    sentCompleteContainerFunction: responseState.sentCompleteContainerFunction,
     sentClientRenderFunction: responseState.sentClientRenderFunction,
     sentStyleInsertionFunction: responseState.sentStyleInsertionFunction,
     externalRuntimeConfig: responseState.externalRuntimeConfig,
@@ -111,12 +118,14 @@ export {
   writeStartSegment,
   writeEndSegment,
   writeCompletedSegmentInstruction,
+  writeCompletedRootBoundaryInstruction,
   writeCompletedBoundaryInstruction,
   writeClientRenderBoundaryInstruction,
   writeStartPendingSuspenseBoundary,
   writeEndPendingSuspenseBoundary,
   writePlaceholder,
   writeCompletedRoot,
+  writeErroredRoot,
   createResources,
   createBoundaryResources,
   writeInitialResources,
diff --git a/packages/react-dom-bindings/src/server/fizz-instruction-set/ReactDOMFizzInlineCompleteContainer.js b/packages/react-dom-bindings/src/server/fizz-instruction-set/ReactDOMFizzInlineCompleteContainer.js
new file mode 100644
index 0000000000000..f1f2a33767f20
--- /dev/null
+++ b/packages/react-dom-bindings/src/server/fizz-instruction-set/ReactDOMFizzInlineCompleteContainer.js
@@ -0,0 +1,5 @@
+import {completeContainer} from './ReactDOMFizzInstructionSetInlineSource';
+
+// This is a string so Closure's advanced compilation mode doesn't mangle it.
+// eslint-disable-next-line dot-notation
+window['$RK'] = completeContainer;
diff --git a/packages/react-dom-bindings/src/server/fizz-instruction-set/ReactDOMFizzInstructionSetExternalRuntime.js b/packages/react-dom-bindings/src/server/fizz-instruction-set/ReactDOMFizzInstructionSetExternalRuntime.js
index 4598accc5d541..86ca93dc43a5b 100644
--- a/packages/react-dom-bindings/src/server/fizz-instruction-set/ReactDOMFizzInstructionSetExternalRuntime.js
+++ b/packages/react-dom-bindings/src/server/fizz-instruction-set/ReactDOMFizzInstructionSetExternalRuntime.js
@@ -14,14 +14,35 @@ export {clientRenderBoundary, completeBoundary, completeSegment};
 
 const resourceMap = new Map();
 
-// This function is almost identical to the version used by inline scripts
-// (ReactDOMFizzInstructionSetInlineSource), with the exception of how we read
-// completeBoundary and resourceMap
 export function completeBoundaryWithStyles(
   suspenseBoundaryID,
   contentID,
   styles,
 ) {
+  const complete = completeBoundary.bind(
+    null,
+    suspenseBoundaryID,
+    contentID,
+    null,
+  );
+  const clientRender = completeBoundary.bind(
+    null,
+    suspenseBoundaryID,
+    contentID,
+    'Stylesheet failed to load.',
+  );
+  insertStyles(styles).then(complete, clientRender);
+}
+export function completeContainerWithStyles(
+  suspenseBoundaryID,
+  contentID,
+  styles,
+) {
+  const complete = completeContainer.bind(null, suspenseBoundaryID, contentID);
+  insertStyles(styles).then(complete, complete);
+}
+
+function insertStyles(styles) {
   const precedences = new Map();
   const thisDocument = document;
   let lastResource, node;
@@ -69,7 +90,7 @@ export function completeBoundaryWithStyles(
     // We stash a pending promise in our map by href which will resolve or reject
     // when the underlying resource loads or errors. We add it to the dependencies
     // array to be returned.
-    loadingState = resourceEl['_p'] = new Promise((re, rj) => {
+    loadingState = resourceEl['_r'] = new Promise((re, rj) => {
       resourceEl.onload = re;
       resourceEl.onerror = rj;
     });
@@ -101,13 +122,38 @@ export function completeBoundaryWithStyles(
     }
   }
 
-  Promise.all(dependencies).then(
-    completeBoundary.bind(null, suspenseBoundaryID, contentID, ''),
-    completeBoundary.bind(
-      null,
-      suspenseBoundaryID,
-      contentID,
-      'Resource failed to load',
-    ),
-  );
+  return Promise.all(dependencies);
+}
+
+export function completeContainer(containerID, contentID) {
+  const thisDocument = document;
+  try {
+    const contentNode = thisDocument.getElementById(contentID);
+    // We'll detach the content node so that regardless of what happens next we don't leave in the tree.
+    // This might also help by not causing recalcing each time we move a child from here to the target.
+    contentNode.parentNode.removeChild(contentNode);
+
+    // Find the container node.
+    const containerNode = thisDocument.getElementById(containerID);
+    if (!containerNode) {
+      // The user must have already navigated away from this tree.
+      // E.g. because the parent was hydrated. That's fine there's nothing to do
+      // but we have to make sure that we already deleted the container node.
+      return;
+    }
+
+    // This is a container insertion. we clear simply clear the container
+    containerNode.textContent = '';
+
+    // Insert all the children from the contentNode between the start and end of suspense boundary.
+    while (contentNode.firstChild) {
+      containerNode.appendChild(contentNode.firstChild);
+    }
+  } finally {
+    const bootstrapNode = thisDocument.getElementById('bs:' + contentID);
+    if (bootstrapNode) {
+      thisDocument.body.appendChild(bootstrapNode.content);
+      bootstrapNode.parentNode.removeChild(bootstrapNode);
+    }
+  }
 }
diff --git a/packages/react-dom-bindings/src/server/fizz-instruction-set/ReactDOMFizzInstructionSetInlineCodeStrings.js b/packages/react-dom-bindings/src/server/fizz-instruction-set/ReactDOMFizzInstructionSetInlineCodeStrings.js
index 17ec195e07c71..326a89e3d5bb6 100644
--- a/packages/react-dom-bindings/src/server/fizz-instruction-set/ReactDOMFizzInstructionSetInlineCodeStrings.js
+++ b/packages/react-dom-bindings/src/server/fizz-instruction-set/ReactDOMFizzInstructionSetInlineCodeStrings.js
@@ -6,6 +6,8 @@ export const clientRenderBoundary =
 export const completeBoundary =
   '$RC=function(b,c,e){c=document.getElementById(c);c.parentNode.removeChild(c);var a=document.getElementById(b);if(a){b=a.previousSibling;if(e)b.data="$!",a.setAttribute("data-dgst",e);else{e=b.parentNode;a=b.nextSibling;var f=0;do{if(a&&8===a.nodeType){var d=a.data;if("/$"===d)if(0===f)break;else f--;else"$"!==d&&"$?"!==d&&"$!"!==d||f++}d=a.nextSibling;e.removeChild(a);a=d}while(a);for(;c.firstChild;)e.insertBefore(c.firstChild,a);b.data="$"}b._reactRetry&&b._reactRetry()}};';
 export const completeBoundaryWithStyles =
-  '$RM=new Map;\n$RR=function(p,q,v){function r(l){this.s=l}for(var t=$RC,u=$RM,m=new Map,n=document,g,e,f=n.querySelectorAll("link[data-precedence],style[data-precedence]"),d=0;e=f[d++];)m.set(e.dataset.precedence,g=e);e=0;f=[];for(var c,h,b,a;c=v[e++];){var k=0;h=c[k++];if(b=u.get(h))"l"!==b.s&&f.push(b);else{a=n.createElement("link");a.href=h;a.rel="stylesheet";for(a.dataset.precedence=d=c[k++];b=c[k++];)a.setAttribute(b,c[k++]);b=a._p=new Promise(function(l,w){a.onload=l;a.onerror=w});b.then(r.bind(b,\n"l"),r.bind(b,"e"));u.set(h,b);f.push(b);c=m.get(d)||g;c===g&&(g=a);m.set(d,a);c?c.parentNode.insertBefore(a,c.nextSibling):(d=n.head,d.insertBefore(a,d.firstChild))}}Promise.all(f).then(t.bind(null,p,q,""),t.bind(null,p,q,"Resource failed to load"))};';
+  '$RM=new Map;\n$RR=function(p,q,r,v){function t(l){this.s=l}for(var u=$RM,m=new Map,n=document,g,e,f=n.querySelectorAll("link[data-precedence],style[data-precedence]"),d=0;e=f[d++];)m.set(e.dataset.precedence,g=e);e=0;f=[];for(var c,h,b,a;c=v[e++];){var k=0;h=c[k++];if(b=u.get(h))"l"!==b.s&&f.push(b);else{a=n.createElement("link");a.href=h;a.rel="stylesheet";for(a.dataset.precedence=d=c[k++];b=c[k++];)a.setAttribute(b,c[k++]);b=a._r=new Promise(function(l,w){a.onload=l;a.onerror=w});b.then(t.bind(b,\n"l"),t.bind(b,"e"));u.set(h,b);f.push(b);c=m.get(d)||g;c===g&&(g=a);m.set(d,a);c?c.parentNode.insertBefore(a,c.nextSibling):(d=n.head,d.insertBefore(a,d.firstChild))}}Promise.all(f).then(p.bind(null,q,r,""),p.bind(null,q,r,"Stylesheet failed to load."))};';
 export const completeSegment =
   '$RS=function(a,b){a=document.getElementById(a);b=document.getElementById(b);for(a.parentNode.removeChild(a);a.firstChild;)b.parentNode.insertBefore(a.firstChild,b);b.parentNode.removeChild(b)};';
+export const completeContainer =
+  '$RK=function(a,e){var b=document;try{var c=b.getElementById(e);c.parentNode.removeChild(c);var d=b.getElementById(a);if(d)for(d.textContent="";c.firstChild;)d.appendChild(c.firstChild)}finally{if(a=b.getElementById("bs:"+e))b.body.appendChild(a.content),a.parentNode.removeChild(a)}};';
diff --git a/packages/react-dom-bindings/src/server/fizz-instruction-set/ReactDOMFizzInstructionSetInlineSource.js b/packages/react-dom-bindings/src/server/fizz-instruction-set/ReactDOMFizzInstructionSetInlineSource.js
index 3c96d1a15af84..7c72c262ed08e 100644
--- a/packages/react-dom-bindings/src/server/fizz-instruction-set/ReactDOMFizzInstructionSetInlineSource.js
+++ b/packages/react-dom-bindings/src/server/fizz-instruction-set/ReactDOMFizzInstructionSetInlineSource.js
@@ -18,11 +18,11 @@ export {clientRenderBoundary, completeBoundary, completeSegment};
 // runtime (ReactDOMFizzInstructionSetExternalRuntime), with the exception of
 // how we read completeBoundaryImpl and resourceMap
 export function completeBoundaryWithStyles(
+  completionFn,
   suspenseBoundaryID,
   contentID,
   styles,
 ) {
-  const completeBoundaryImpl = window['$RC'];
   const resourceMap = window['$RM'];
 
   const precedences = new Map();
@@ -72,7 +72,7 @@ export function completeBoundaryWithStyles(
     // We stash a pending promise in our map by href which will resolve or reject
     // when the underlying resource loads or errors. We add it to the dependencies
     // array to be returned.
-    loadingState = resourceEl['_p'] = new Promise((re, rj) => {
+    loadingState = resourceEl['_r'] = new Promise((re, rj) => {
       resourceEl.onload = re;
       resourceEl.onerror = rj;
     });
@@ -105,12 +105,45 @@ export function completeBoundaryWithStyles(
   }
 
   Promise.all(dependencies).then(
-    completeBoundaryImpl.bind(null, suspenseBoundaryID, contentID, ''),
-    completeBoundaryImpl.bind(
+    completionFn.bind(null, suspenseBoundaryID, contentID, ''),
+    completionFn.bind(
       null,
       suspenseBoundaryID,
       contentID,
-      'Resource failed to load',
+      'Stylesheet failed to load.',
     ),
   );
 }
+
+export function completeContainer(containerID, contentID) {
+  const thisDocument = document;
+  try {
+    const contentNode = thisDocument.getElementById(contentID);
+    // We'll detach the content node so that regardless of what happens next we don't leave in the tree.
+    // This might also help by not causing recalcing each time we move a child from here to the target.
+    contentNode.parentNode.removeChild(contentNode);
+
+    // Find the container node.
+    const containerNode = thisDocument.getElementById(containerID);
+    if (!containerNode) {
+      // The user must have already navigated away from this tree.
+      // E.g. because the parent was hydrated. That's fine there's nothing to do
+      // but we have to make sure that we already deleted the container node.
+      return;
+    }
+
+    // This is a container insertion. we clear simply clear the container
+    containerNode.textContent = '';
+
+    // Insert all the children from the contentNode between the start and end of suspense boundary.
+    while (contentNode.firstChild) {
+      containerNode.appendChild(contentNode.firstChild);
+    }
+  } finally {
+    const bootstrapNode = thisDocument.getElementById('bs:' + contentID);
+    if (bootstrapNode) {
+      thisDocument.body.appendChild(bootstrapNode.content);
+      bootstrapNode.parentNode.removeChild(bootstrapNode);
+    }
+  }
+}
diff --git a/packages/react-dom-bindings/src/server/fizz-instruction-set/ReactDOMFizzInstructionSetShared.js b/packages/react-dom-bindings/src/server/fizz-instruction-set/ReactDOMFizzInstructionSetShared.js
index a2a8e402e2f27..bbe590a7a0d84 100644
--- a/packages/react-dom-bindings/src/server/fizz-instruction-set/ReactDOMFizzInstructionSetShared.js
+++ b/packages/react-dom-bindings/src/server/fizz-instruction-set/ReactDOMFizzInstructionSetShared.js
@@ -112,6 +112,39 @@ export function completeBoundary(suspenseBoundaryID, contentID, errorDigest) {
   }
 }
 
+export function completeContainer(containerID, contentID) {
+  const thisDocument = document;
+  try {
+    const contentNode = thisDocument.getElementById(contentID);
+    // We'll detach the content node so that regardless of what happens next we don't leave in the tree.
+    // This might also help by not causing recalcing each time we move a child from here to the target.
+    contentNode.parentNode.removeChild(contentNode);
+
+    // Find the container node.
+    const containerNode = thisDocument.getElementById(containerID);
+    if (!containerNode) {
+      // The user must have already navigated away from this tree.
+      // E.g. because the parent was hydrated. That's fine there's nothing to do
+      // but we have to make sure that we already deleted the container node.
+      return;
+    }
+
+    // This is a container insertion. we clear simply clear the container
+    containerNode.textContent = '';
+
+    // Insert all the children from the contentNode between the start and end of suspense boundary.
+    while (contentNode.firstChild) {
+      containerNode.appendChild(contentNode.firstChild);
+    }
+  } finally {
+    const bootstrapNode = thisDocument.getElementById('bs:' + contentID);
+    if (bootstrapNode) {
+      thisDocument.body.appendChild(bootstrapNode.content);
+      bootstrapNode.parentNode.removeChild(bootstrapNode);
+    }
+  }
+}
+
 export function completeSegment(containerID, placeholderID) {
   const segmentContainer = document.getElementById(containerID);
   const placeholderNode = document.getElementById(placeholderID);
diff --git a/packages/react-dom/npm/server.browser.js b/packages/react-dom/npm/server.browser.js
index 4b7749d4cd9b7..7b1a2d0bcbf4a 100644
--- a/packages/react-dom/npm/server.browser.js
+++ b/packages/react-dom/npm/server.browser.js
@@ -15,3 +15,7 @@ exports.renderToStaticMarkup = l.renderToStaticMarkup;
 exports.renderToNodeStream = l.renderToNodeStream;
 exports.renderToStaticNodeStream = l.renderToStaticNodeStream;
 exports.renderToReadableStream = s.renderToReadableStream;
+
+if (typeof s.renderIntoContainer === 'function') {
+  exports.renderIntoContainer = s.renderIntoContainer;
+}
diff --git a/packages/react-dom/npm/server.bun.js b/packages/react-dom/npm/server.bun.js
index aa27124d58a54..f879de0a46580 100644
--- a/packages/react-dom/npm/server.bun.js
+++ b/packages/react-dom/npm/server.bun.js
@@ -1,18 +1,21 @@
 'use strict';
 
-var b;
-var l;
+var l, s;
 if (process.env.NODE_ENV === 'production') {
-  b = require('./cjs/react-dom-server.bun.production.min.js');
   l = require('./cjs/react-dom-server-legacy.browser.production.min.js');
+  s = require('./cjs/react-dom-server.bun.production.min.js');
 } else {
-  b = require('./cjs/react-dom-server.bun.development.js');
   l = require('./cjs/react-dom-server-legacy.browser.development.js');
+  s = require('./cjs/react-dom-server.bun.development.js');
 }
 
-exports.version = b.version;
-exports.renderToReadableStream = b.renderToReadableStream;
-exports.renderToNodeStream = b.renderToNodeStream;
-exports.renderToStaticNodeStream = b.renderToStaticNodeStream;
+exports.version = l.version;
 exports.renderToString = l.renderToString;
 exports.renderToStaticMarkup = l.renderToStaticMarkup;
+exports.renderToStaticNodeStream = s.renderToStaticNodeStream;
+exports.renderToNodeStream = s.renderToNodeStream;
+exports.renderToReadableStream = s.renderToReadableStream;
+
+if (typeof s.renderIntoContainer === 'function') {
+  exports.renderIntoContainer = s.renderIntoContainer;
+}
diff --git a/packages/react-dom/npm/server.node.js b/packages/react-dom/npm/server.node.js
index 2eb97e80354c8..61081ae3e5283 100644
--- a/packages/react-dom/npm/server.node.js
+++ b/packages/react-dom/npm/server.node.js
@@ -15,3 +15,8 @@ exports.renderToStaticMarkup = l.renderToStaticMarkup;
 exports.renderToNodeStream = l.renderToNodeStream;
 exports.renderToStaticNodeStream = l.renderToStaticNodeStream;
 exports.renderToPipeableStream = s.renderToPipeableStream;
+
+if (typeof s.renderIntoContainerAsPipeableStream === 'function') {
+  exports.renderIntoContainerAsPipeableStream =
+    s.renderIntoContainerAsPipeableStream;
+}
diff --git a/packages/react-dom/server.browser.js b/packages/react-dom/server.browser.js
index b17e136e5f22a..715edc12adaed 100644
--- a/packages/react-dom/server.browser.js
+++ b/packages/react-dom/server.browser.js
@@ -42,3 +42,10 @@ export function renderToReadableStream() {
     arguments,
   );
 }
+
+export function renderIntoContainer() {
+  return require('./src/server/ReactDOMFizzServerBrowser').renderIntoContainer.apply(
+    this,
+    arguments,
+  );
+}
diff --git a/packages/react-dom/server.bun.js b/packages/react-dom/server.bun.js
index 0ac32351ec46d..34a516ac3e4fd 100644
--- a/packages/react-dom/server.bun.js
+++ b/packages/react-dom/server.bun.js
@@ -11,8 +11,15 @@
 import ReactVersion from 'shared/ReactVersion';
 export {ReactVersion as version};
 
-export function renderToReadableStream() {
-  return require('./src/server/ReactDOMFizzServerBun').renderToReadableStream.apply(
+export function renderToString() {
+  return require('./src/server/ReactDOMLegacyServerBrowser').renderToString.apply(
+    this,
+    arguments,
+  );
+}
+
+export function renderToStaticMarkup() {
+  return require('./src/server/ReactDOMLegacyServerBrowser').renderToStaticMarkup.apply(
     this,
     arguments,
   );
@@ -32,15 +39,14 @@ export function renderToStaticNodeStream() {
   );
 }
 
-export function renderToString() {
-  return require('./src/server/ReactDOMLegacyServerBrowser').renderToString.apply(
+export function renderToReadableStream() {
+  return require('./src/server/ReactDOMFizzServerBun').renderToReadableStream.apply(
     this,
     arguments,
   );
 }
-
-export function renderToStaticMarkup() {
-  return require('./src/server/ReactDOMLegacyServerBrowser').renderToStaticMarkup.apply(
+export function renderIntoContainer() {
+  return require('./src/server/ReactDOMFizzServerBun').renderIntoContainer.apply(
     this,
     arguments,
   );
diff --git a/packages/react-dom/server.node.js b/packages/react-dom/server.node.js
index 3ef13b8540ada..8734e7446b02e 100644
--- a/packages/react-dom/server.node.js
+++ b/packages/react-dom/server.node.js
@@ -42,3 +42,10 @@ export function renderToPipeableStream() {
     arguments,
   );
 }
+
+export function renderIntoContainerAsPipeableStream() {
+  return require('./src/server/ReactDOMFizzServerNode').renderIntoContainerAsPipeableStream.apply(
+    this,
+    arguments,
+  );
+}
diff --git a/packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js b/packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js
index e314cbae13d1f..9bd38c5177ee2 100644
--- a/packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js
+++ b/packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js
@@ -13,6 +13,9 @@ import {
   mergeOptions,
   stripExternalRuntimeInNodes,
   withLoadingReadyState,
+  installScriptObserver,
+  removeScriptObserver,
+  pendingWork,
 } from '../test-utils/FizzTestUtils';
 
 let JSDOM;
@@ -126,7 +129,43 @@ describe('ReactDOMFizzServer', () => {
       .join('');
   }
 
-  async function act(callback) {
+  function loadStylesheets(hrefs) {
+    const event = document.createEvent('Events');
+    event.initEvent('load', false, false);
+    if (Array.isArray(hrefs)) {
+      hrefs.forEach(href => {
+        const links = document.querySelectorAll(
+          `link[data-precedence][href="${href}"]`,
+        );
+        links.forEach(l => l.dispatchEvent(event));
+      });
+    } else {
+      const links = document.querySelectorAll(`link[data-precedence]`);
+      links.forEach(l => l.dispatchEvent(event));
+    }
+  }
+
+  function errorStylesheets(hrefs) {
+    const event = document.createEvent('Events');
+    event.initEvent('error', false, false);
+    if (Array.isArray(hrefs)) {
+      hrefs.forEach(href => {
+        const links = document.querySelectorAll(
+          `link[data-precedence][href="${href}"]`,
+        );
+        links.forEach(l => l.dispatchEvent(event));
+      });
+    } else {
+      const links = document.querySelectorAll(`link[data-precedence]`);
+      links.forEach(l => l.dispatchEvent(event));
+    }
+  }
+
+  // This was previously called "act" but it has unconventional behavior because it models
+  // streaming into a container node when a browser would not do that except in very contrived
+  // circumstances. We should migrate to the new act which infers the streaming location as
+  // either the document, documentElement, or document.body as appropriate
+  async function actIntoContainer(callback) {
     await callback();
     // Await one turn around the event loop.
     // This assumes that we'll flush everything we have so far.
@@ -154,7 +193,9 @@ describe('ReactDOMFizzServer', () => {
     }, document);
   }
 
-  async function actIntoEmptyDocument(callback) {
+  async function act(callback) {
+    installScriptObserver(window, document);
+
     await callback();
     // Await one turn around the event loop.
     // This assumes that we'll flush everything we have so far.
@@ -164,36 +205,80 @@ describe('ReactDOMFizzServer', () => {
     if (hasErrored) {
       throw fatalError;
     }
+
     // JSDOM doesn't support stream HTML parser so we need to give it a proper fragment.
     // We also want to execute any scripts that are embedded.
     // We assume that we have now received a proper fragment of HTML.
     const bufferedContent = buffer;
-    // Test Environment
-    const jsdom = new JSDOM(bufferedContent, {
-      runScripts: 'dangerously',
-    });
-    window = jsdom.window;
-    document = jsdom.window.document;
-    container = document;
     buffer = '';
+
+    let parent;
+    let temporaryHostElement;
+    if (bufferedContent.startsWith('<!DOCTYPE html>')) {
+      parent = document;
+      document.removeChild(document.documentElement);
+
+      // Parse the buffered content into a temporary document
+      const jsdom = new JSDOM(bufferedContent);
+      temporaryHostElement = jsdom.window.document;
+
+      // Remove the Doctype node
+      temporaryHostElement.removeChild(temporaryHostElement.firstChild);
+    } else if (bufferedContent.startsWith('<html')) {
+      throw new Error(
+        '"act" processed buffered content that starts with an <html> tag but does not contain the Doctype declaration. This is likely a bug in React',
+      );
+    } else if (bufferedContent.startsWith('<head')) {
+      parent = document.documentElement;
+      parent.innerHTML = '';
+      temporaryHostElement = document.createElement('html');
+      temporaryHostElement.innerHTML = bufferedContent;
+    } else if (bufferedContent.startsWith('<body')) {
+      parent = document.documentElement;
+      if (document.body) {
+        parent.removeChild(document.body);
+      }
+      temporaryHostElement = document.createElement('html');
+      temporaryHostElement.innerHTML = bufferedContent;
+    } else {
+      parent = document.body;
+      temporaryHostElement = document.createElement('body');
+      temporaryHostElement.innerHTML = bufferedContent;
+    }
+
     await withLoadingReadyState(async () => {
-      await replaceScriptsAndMove(window, CSPnonce, document.documentElement);
+      while (temporaryHostElement.firstChild) {
+        parent.appendChild(temporaryHostElement.firstChild);
+      }
+      // If there is any async work to do to execute these scripts we await that now. We want
+      // to do this while the document loading state is overriden so the fizz runtime will
+      // install it's own mutation observer
+      await pendingWork(window);
     }, document);
+
+    removeScriptObserver(document);
   }
 
-  function getVisibleChildren(element) {
+  function getMeaningfulChildren(element, excludeScriptsSrcs) {
+    const exclude = excludeScriptsSrcs || ['ReactDOMServerExternalRuntime.js'];
     const children = [];
     let node = element.firstChild;
     while (node) {
       if (node.nodeType === 1) {
+        const normalizedTagName = node.tagName.toLowerCase();
         if (
-          node.tagName !== 'SCRIPT' &&
-          node.tagName !== 'script' &&
-          node.tagName !== 'TEMPLATE' &&
-          node.tagName !== 'template' &&
-          !node.hasAttribute('hidden') &&
-          !node.hasAttribute('aria-hidden')
+          (normalizedTagName === 'script' &&
+            ((node.hasAttribute('src') &&
+              exclude.some(srcFragment =>
+                node.getAttribute('src').includes(srcFragment),
+              )) ||
+              node.attributes.length === 0)) ||
+          normalizedTagName === 'template' ||
+          node.hasAttribute('hidden') ||
+          node.hasAttribute('aria-hidden')
         ) {
+          // noop
+        } else {
           const props = {};
           const attributes = node.attributes;
           for (let i = 0; i < attributes.length; i++) {
@@ -206,7 +291,7 @@ describe('ReactDOMFizzServer', () => {
             }
             props[attributes[i].name] = attributes[i].value;
           }
-          props.children = getVisibleChildren(node);
+          props.children = getMeaningfulChildren(node, exclude);
           children.push(React.createElement(node.tagName.toLowerCase(), props));
         }
       } else if (node.nodeType === 3) {
@@ -305,6 +390,14 @@ describe('ReactDOMFizzServer', () => {
       mergeOptions(options, renderOptions),
     );
   }
+  function renderIntoContainerAsPipeableStream(jsx, containerID, options) {
+    // Merge options with renderOptions, which may contain featureFlag specific behavior
+    return ReactDOMFizzServer.renderIntoContainerAsPipeableStream(
+      jsx,
+      containerID,
+      mergeOptions(options, renderOptions),
+    );
+  }
 
   it('should asynchronously load a lazy component', async () => {
     const originalConsoleError = console.error;
@@ -342,7 +435,7 @@ describe('ReactDOMFizzServer', () => {
     };
 
     try {
-      await act(async () => {
+      await actIntoContainer(async () => {
         const {pipe} = renderToPipeableStream(
           <div>
             <div>
@@ -360,25 +453,25 @@ describe('ReactDOMFizzServer', () => {
         pipe(writable);
       });
 
-      expect(getVisibleChildren(container)).toEqual(
+      expect(getMeaningfulChildren(container)).toEqual(
         <div>
           <div>Loading...</div>
           <div>Loading...</div>
         </div>,
       );
-      await act(async () => {
+      await actIntoContainer(async () => {
         resolveA({default: Text});
       });
-      expect(getVisibleChildren(container)).toEqual(
+      expect(getMeaningfulChildren(container)).toEqual(
         <div>
           <div>Hello</div>
           <div>Loading...</div>
         </div>,
       );
-      await act(async () => {
+      await actIntoContainer(async () => {
         resolveB({default: TextWithPunctuation});
       });
-      expect(getVisibleChildren(container)).toEqual(
+      expect(getMeaningfulChildren(container)).toEqual(
         <div>
           <div>Hello</div>
           <div>world!</div>
@@ -425,19 +518,19 @@ describe('ReactDOMFizzServer', () => {
 
     // Server-side
     const [App, resolve] = makeApp();
-    await act(async () => {
+    await actIntoContainer(async () => {
       const {pipe} = renderToPipeableStream(<App />);
       pipe(writable);
     });
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <div>
         <span>Loading...</span>
       </div>,
     );
-    await act(async () => {
+    await actIntoContainer(async () => {
       resolve();
     });
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <div>
         <span id="async">async</span>
         <span id="after">after</span>
@@ -446,21 +539,21 @@ describe('ReactDOMFizzServer', () => {
 
     // Client-side
     const [HydrateApp, hydrateResolve] = makeApp();
-    await act(async () => {
+    await actIntoContainer(async () => {
       ReactDOMClient.hydrateRoot(container, <HydrateApp />);
     });
 
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <div>
         <span id="async">async</span>
         <span id="after">after</span>
       </div>,
     );
 
-    await act(async () => {
+    await actIntoContainer(async () => {
       hydrateResolve();
     });
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <div>
         <span id="async">async</span>
         <span id="after">after</span>
@@ -478,7 +571,7 @@ describe('ReactDOMFizzServer', () => {
         });
       });
 
-      await act(async () => {
+      await actIntoContainer(async () => {
         const {pipe} = renderToPipeableStream(
           <div>
             <Suspense fallback={<Text text="Loading..." />}>
@@ -489,11 +582,11 @@ describe('ReactDOMFizzServer', () => {
         );
         pipe(writable);
       });
-      expect(getVisibleChildren(container)).toEqual(<div>Loading...</div>);
-      await act(async () => {
+      expect(getMeaningfulChildren(container)).toEqual(<div>Loading...</div>);
+      await actIntoContainer(async () => {
         resolve({default: Text});
       });
-      expect(getVisibleChildren(container)).toEqual(<div>Hello</div>);
+      expect(getMeaningfulChildren(container)).toEqual(<div>Hello</div>);
     } finally {
       CSPnonce = null;
     }
@@ -538,7 +631,7 @@ describe('ReactDOMFizzServer', () => {
     const expectedDigest = onError(theError);
     loggedErrors.length = 0;
 
-    await act(async () => {
+    await actIntoContainer(async () => {
       const {pipe} = renderToPipeableStream(<App isClient={false} />, {
         bootstrapScriptContent: '__INIT__();',
         onError,
@@ -551,18 +644,18 @@ describe('ReactDOMFizzServer', () => {
     Scheduler.unstable_flushAll();
 
     // We're still loading because we're waiting for the server to stream more content.
-    expect(getVisibleChildren(container)).toEqual(<div>Loading...</div>);
+    expect(getMeaningfulChildren(container)).toEqual(<div>Loading...</div>);
 
     expect(loggedErrors).toEqual([]);
 
-    await act(async () => {
+    await actIntoContainer(async () => {
       rejectComponent(theError);
     });
 
     expect(loggedErrors).toEqual([theError]);
 
     // We haven't ran the client hydration yet.
-    expect(getVisibleChildren(container)).toEqual(<div>Loading...</div>);
+    expect(getMeaningfulChildren(container)).toEqual(<div>Loading...</div>);
 
     // Now we can client render it instead.
     expect(Scheduler).toFlushAndYield([]);
@@ -584,7 +677,7 @@ describe('ReactDOMFizzServer', () => {
     );
 
     // The client rendered HTML is now in place.
-    expect(getVisibleChildren(container)).toEqual(<div>Hello</div>);
+    expect(getMeaningfulChildren(container)).toEqual(<div>Hello</div>);
 
     expect(loggedErrors).toEqual([theError]);
   });
@@ -597,7 +690,7 @@ describe('ReactDOMFizzServer', () => {
       });
     });
 
-    await act(async () => {
+    await actIntoContainer(async () => {
       const {pipe} = renderToPipeableStream(
         <div>
           <Suspense fallback={<Text text="Loading..." />}>
@@ -607,7 +700,7 @@ describe('ReactDOMFizzServer', () => {
       );
       pipe(writable);
     });
-    expect(getVisibleChildren(container)).toEqual(<div>Loading...</div>);
+    expect(getMeaningfulChildren(container)).toEqual(<div>Loading...</div>);
     // Because there is no content inside the Suspense boundary that could've
     // been written, we expect to not see any additional partial data flushed
     // yet.
@@ -617,10 +710,10 @@ describe('ReactDOMFizzServer', () => {
         renderOptions.unstable_externalRuntimeSrc,
       ).length,
     ).toBe(1);
-    await act(async () => {
+    await actIntoContainer(async () => {
       resolveElement({default: <Text text="Hello" />});
     });
-    expect(getVisibleChildren(container)).toEqual(<div>Hello</div>);
+    expect(getMeaningfulChildren(container)).toEqual(<div>Hello</div>);
   });
 
   it('should client render a boundary if a lazy element rejects', async () => {
@@ -651,7 +744,7 @@ describe('ReactDOMFizzServer', () => {
       );
     }
 
-    await act(async () => {
+    await actIntoContainer(async () => {
       const {pipe} = renderToPipeableStream(
         <App isClient={false} />,
 
@@ -673,18 +766,18 @@ describe('ReactDOMFizzServer', () => {
     Scheduler.unstable_flushAll();
 
     // We're still loading because we're waiting for the server to stream more content.
-    expect(getVisibleChildren(container)).toEqual(<div>Loading...</div>);
+    expect(getMeaningfulChildren(container)).toEqual(<div>Loading...</div>);
 
     expect(loggedErrors).toEqual([]);
 
-    await act(async () => {
+    await actIntoContainer(async () => {
       rejectElement(theError);
     });
 
     expect(loggedErrors).toEqual([theError]);
 
     // We haven't ran the client hydration yet.
-    expect(getVisibleChildren(container)).toEqual(<div>Loading...</div>);
+    expect(getMeaningfulChildren(container)).toEqual(<div>Loading...</div>);
 
     // Now we can client render it instead.
     expect(Scheduler).toFlushAndYield([]);
@@ -707,7 +800,7 @@ describe('ReactDOMFizzServer', () => {
     );
 
     // The client rendered HTML is now in place.
-    // expect(getVisibleChildren(container)).toEqual(<div>Hello</div>);
+    // expect(getMeaningfulChildren(container)).toEqual(<div>Hello</div>);
 
     expect(loggedErrors).toEqual([theError]);
   });
@@ -747,7 +840,7 @@ describe('ReactDOMFizzServer', () => {
     const expectedDigest = onError(theError);
     loggedErrors.length = 0;
 
-    await act(async () => {
+    await actIntoContainer(async () => {
       const {pipe} = renderToPipeableStream(
         <App />,
 
@@ -768,7 +861,7 @@ describe('ReactDOMFizzServer', () => {
     });
     Scheduler.unstable_flushAll();
 
-    expect(getVisibleChildren(container)).toEqual(<div>Hello World</div>);
+    expect(getMeaningfulChildren(container)).toEqual(<div>Hello World</div>);
 
     expectErrors(
       errors,
@@ -815,7 +908,7 @@ describe('ReactDOMFizzServer', () => {
     const expectedDigest = onError(theError);
     loggedErrors.length = 0;
 
-    await act(async () => {
+    await actIntoContainer(async () => {
       const {pipe} = renderToPipeableStream(
         <App />,
 
@@ -836,14 +929,14 @@ describe('ReactDOMFizzServer', () => {
     });
     Scheduler.unstable_flushAll();
 
-    expect(getVisibleChildren(container)).toEqual(<div>Loading...</div>);
+    expect(getMeaningfulChildren(container)).toEqual(<div>Loading...</div>);
 
-    await act(async () => {
+    await actIntoContainer(async () => {
       rejectComponent(theError);
     });
 
     expect(loggedErrors).toEqual([theError]);
-    expect(getVisibleChildren(container)).toEqual(<div>Loading...</div>);
+    expect(getMeaningfulChildren(container)).toEqual(<div>Loading...</div>);
 
     // Now we can client render it instead.
     expect(Scheduler).toFlushAndYield([]);
@@ -866,12 +959,12 @@ describe('ReactDOMFizzServer', () => {
     );
 
     // The client rendered HTML is now in place.
-    expect(getVisibleChildren(container)).toEqual(<div>Hello</div>);
+    expect(getMeaningfulChildren(container)).toEqual(<div>Hello</div>);
     expect(loggedErrors).toEqual([theError]);
   });
 
   it('should asynchronously load the suspense boundary', async () => {
-    await act(async () => {
+    await actIntoContainer(async () => {
       const {pipe} = renderToPipeableStream(
         <div>
           <Suspense fallback={<Text text="Loading..." />}>
@@ -881,11 +974,11 @@ describe('ReactDOMFizzServer', () => {
       );
       pipe(writable);
     });
-    expect(getVisibleChildren(container)).toEqual(<div>Loading...</div>);
-    await act(async () => {
+    expect(getMeaningfulChildren(container)).toEqual(<div>Loading...</div>);
+    await actIntoContainer(async () => {
       resolveText('Hello World');
     });
-    expect(getVisibleChildren(container)).toEqual(<div>Hello World</div>);
+    expect(getMeaningfulChildren(container)).toEqual(<div>Hello World</div>);
   });
 
   it('waits for pending content to come in from the server and then hydrates it', async () => {
@@ -910,7 +1003,7 @@ describe('ReactDOMFizzServer', () => {
       ReactDOMClient.hydrateRoot(container, <App />);
     };
 
-    await act(async () => {
+    await actIntoContainer(async () => {
       const {pipe} = renderToPipeableStream(<App />, {
         bootstrapScriptContent: '__INIT__();',
       });
@@ -918,7 +1011,7 @@ describe('ReactDOMFizzServer', () => {
     });
 
     // We're still showing a fallback.
-    expect(getVisibleChildren(container)).toEqual(<div>Loading...</div>);
+    expect(getMeaningfulChildren(container)).toEqual(<div>Loading...</div>);
 
     // We already bootstrapped.
     expect(bootstrapped).toBe(true);
@@ -927,15 +1020,15 @@ describe('ReactDOMFizzServer', () => {
     Scheduler.unstable_flushAll();
 
     // We're still loading because we're waiting for the server to stream more content.
-    expect(getVisibleChildren(container)).toEqual(<div>Loading...</div>);
+    expect(getMeaningfulChildren(container)).toEqual(<div>Loading...</div>);
 
     // The server now updates the content in place in the fallback.
-    await act(async () => {
+    await actIntoContainer(async () => {
       resolveText('Hello');
     });
 
     // The final HTML is now in place.
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <div>
         <h1>Hello</h1>
       </div>,
@@ -984,7 +1077,7 @@ describe('ReactDOMFizzServer', () => {
     const loggedErrors = [];
 
     // We originally suspend the boundary and start streaming the loading state.
-    await act(async () => {
+    await actIntoContainer(async () => {
       const {pipe} = renderToPipeableStream(
         <App />,
 
@@ -998,7 +1091,7 @@ describe('ReactDOMFizzServer', () => {
     });
 
     // We're still showing a fallback.
-    expect(getVisibleChildren(container)).toEqual(<div>Loading...</div>);
+    expect(getMeaningfulChildren(container)).toEqual(<div>Loading...</div>);
 
     expect(loggedErrors).toEqual([]);
 
@@ -1007,10 +1100,10 @@ describe('ReactDOMFizzServer', () => {
     Scheduler.unstable_flushAll();
 
     // We're still loading because we're waiting for the server to stream more content.
-    expect(getVisibleChildren(container)).toEqual(<div>Loading...</div>);
+    expect(getMeaningfulChildren(container)).toEqual(<div>Loading...</div>);
 
     const theError = new Error('Error Message');
-    await act(async () => {
+    await actIntoContainer(async () => {
       rejectText('This Errors', theError);
     });
 
@@ -1018,14 +1111,14 @@ describe('ReactDOMFizzServer', () => {
 
     // The server errored, but we still haven't hydrated. We don't know if the
     // client will succeed yet, so we still show the loading state.
-    expect(getVisibleChildren(container)).toEqual(<div>Loading...</div>);
+    expect(getMeaningfulChildren(container)).toEqual(<div>Loading...</div>);
     expect(ref.current).toBe(null);
 
     // Flush the hydration.
     Scheduler.unstable_flushAll();
 
     // Hydrating should've generated an error and replaced the suspense boundary.
-    expect(getVisibleChildren(container)).toEqual(<b>Error Message</b>);
+    expect(getMeaningfulChildren(container)).toEqual(<b>Error Message</b>);
 
     const b = container.getElementsByTagName('b')[0];
     expect(ref.current).toBe(b);
@@ -1066,7 +1159,7 @@ describe('ReactDOMFizzServer', () => {
     }
 
     // We originally suspend the boundary and start streaming the loading state.
-    await act(async () => {
+    await actIntoContainer(async () => {
       const {pipe} = renderToPipeableStream(<App showMore={false} />);
       pipe(writable);
     });
@@ -1079,7 +1172,7 @@ describe('ReactDOMFizzServer', () => {
 
     // We're not hydrated yet.
     expect(ref.current).toBe(null);
-    expect(getVisibleChildren(container)).toEqual([
+    expect(getMeaningfulChildren(container)).toEqual([
       'Loading A',
       // TODO: This is incorrect. It should be "Loading B" but Fizz SuspenseList
       // isn't implemented fully yet.
@@ -1094,7 +1187,7 @@ describe('ReactDOMFizzServer', () => {
     expect(ref.current).toBe(null);
 
     // We haven't resolved yet.
-    expect(getVisibleChildren(container)).toEqual([
+    expect(getMeaningfulChildren(container)).toEqual([
       'Loading A',
       // TODO: This is incorrect. It should be "Loading B" but Fizz SuspenseList
       // isn't implemented fully yet.
@@ -1102,13 +1195,13 @@ describe('ReactDOMFizzServer', () => {
       'Loading C',
     ]);
 
-    await act(async () => {
+    await actIntoContainer(async () => {
       await resolveText('A');
     });
 
     Scheduler.unstable_flushAll();
 
-    expect(getVisibleChildren(container)).toEqual([
+    expect(getMeaningfulChildren(container)).toEqual([
       <span>A</span>,
       <span>B</span>,
       <span>C</span>,
@@ -1139,7 +1232,7 @@ describe('ReactDOMFizzServer', () => {
     }
 
     let controls;
-    await act(async () => {
+    await actIntoContainer(async () => {
       controls = renderToPipeableStream(<App />, {onError});
       controls.pipe(writable);
     });
@@ -1156,10 +1249,10 @@ describe('ReactDOMFizzServer', () => {
     Scheduler.unstable_flushAll();
 
     // We're still loading because we're waiting for the server to stream more content.
-    expect(getVisibleChildren(container)).toEqual(<div>Loading...</div>);
+    expect(getMeaningfulChildren(container)).toEqual(<div>Loading...</div>);
 
     // We abort the server response.
-    await act(async () => {
+    await actIntoContainer(async () => {
       controls.abort();
     });
 
@@ -1181,14 +1274,14 @@ describe('ReactDOMFizzServer', () => {
         ],
       ],
     );
-    expect(getVisibleChildren(container)).toEqual(<div>Loading...</div>);
+    expect(getMeaningfulChildren(container)).toEqual(<div>Loading...</div>);
 
     // We now resolve it on the client.
     resolveText('Hello');
     Scheduler.unstable_flushAll();
 
     // The client rendered HTML is now in place.
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <div>
         <h1>Hello</h1>
       </div>,
@@ -1209,7 +1302,7 @@ describe('ReactDOMFizzServer', () => {
       writable.write(chunk, encoding, next);
     };
 
-    await act(async () => {
+    await actIntoContainer(async () => {
       const {pipe} = renderToPipeableStream(
         // We use two nested boundaries to flush out coverage of an old reentrancy bug.
         <Suspense fallback="Loading...">
@@ -1233,7 +1326,7 @@ describe('ReactDOMFizzServer', () => {
       );
     });
 
-    await act(async () => {
+    await actIntoContainer(async () => {
       const {pipe} = renderToPipeableStream(
         <Suspense fallback={<Text text="Loading B..." />}>
           <Text text="This will show B: " />
@@ -1252,30 +1345,30 @@ describe('ReactDOMFizzServer', () => {
       );
     });
 
-    expect(getVisibleChildren(container)).toEqual([
+    expect(getMeaningfulChildren(container)).toEqual([
       <div id="container-A">Loading A...</div>,
       <div id="container-B">Loading B...</div>,
     ]);
 
-    await act(async () => {
+    await actIntoContainer(async () => {
       resolveText('B');
     });
 
-    expect(getVisibleChildren(container)).toEqual([
+    expect(getMeaningfulChildren(container)).toEqual([
       <div id="container-A">Loading A...</div>,
       <div id="container-B">
         This will show B: <div>B</div>
       </div>,
     ]);
 
-    await act(async () => {
+    await actIntoContainer(async () => {
       resolveText('A');
     });
 
     // We're done writing both streams now.
     writable.end();
 
-    expect(getVisibleChildren(container)).toEqual([
+    expect(getMeaningfulChildren(container)).toEqual([
       <div id="container-A">
         This will show A: <div>A</div>
       </div>,
@@ -1329,31 +1422,31 @@ describe('ReactDOMFizzServer', () => {
       );
     }
 
-    await act(async () => {
+    await actIntoContainer(async () => {
       const {pipe} = renderToPipeableStream(<App />);
       pipe(writable);
     });
 
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <div>
         <select>Loading...</select>Loading...
       </div>,
     );
 
-    await act(async () => {
+    await actIntoContainer(async () => {
       resolveText('Hello');
     });
 
-    await act(async () => {
+    await actIntoContainer(async () => {
       resolveText('World');
     });
 
-    await act(async () => {
+    await actIntoContainer(async () => {
       resolveText('my-path');
       resolveText('my-mi');
     });
 
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <div>
         <select>
           <option>Hello</option>
@@ -1416,12 +1509,12 @@ describe('ReactDOMFizzServer', () => {
       );
     }
 
-    await act(async () => {
+    await actIntoContainer(async () => {
       const {pipe} = renderToPipeableStream(<App />);
       pipe(writable);
     });
 
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <table>
         <tbody>
           <tr>
@@ -1431,19 +1524,19 @@ describe('ReactDOMFizzServer', () => {
       </table>,
     );
 
-    await act(async () => {
+    await actIntoContainer(async () => {
       resolveText('A');
     });
 
-    await act(async () => {
+    await actIntoContainer(async () => {
       resolveText('B');
     });
 
-    await act(async () => {
+    await actIntoContainer(async () => {
       resolveText('C');
     });
 
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <table>
         <tbody class="A">
           <tr class="B">
@@ -1469,7 +1562,7 @@ describe('ReactDOMFizzServer', () => {
       );
     }
 
-    await act(async () => {
+    await actIntoContainer(async () => {
       const {pipe} = renderToPipeableStream(
         <App />,
 
@@ -1484,7 +1577,7 @@ describe('ReactDOMFizzServer', () => {
       );
     });
 
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <svg>
         <g>
           <text>Loading...</text>
@@ -1492,11 +1585,11 @@ describe('ReactDOMFizzServer', () => {
       </svg>,
     );
 
-    await act(async () => {
+    await actIntoContainer(async () => {
       resolveText('my-path');
     });
 
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <svg>
         <g>
           <path id="my-path" />
@@ -1555,12 +1648,12 @@ describe('ReactDOMFizzServer', () => {
     };
 
     try {
-      await act(async () => {
+      await actIntoContainer(async () => {
         const {pipe} = renderToPipeableStream(<A />);
         pipe(writable);
       });
 
-      expect(getVisibleChildren(container)).toEqual(
+      expect(getMeaningfulChildren(container)).toEqual(
         <div>
           <incorrecttag>Loading</incorrecttag>
         </div>,
@@ -1582,7 +1675,7 @@ describe('ReactDOMFizzServer', () => {
         expect(mockError).not.toHaveBeenCalled();
       }
 
-      await act(async () => {
+      await actIntoContainer(async () => {
         resolveText('Hello');
         resolveText('World');
       });
@@ -1604,7 +1697,7 @@ describe('ReactDOMFizzServer', () => {
         expect(mockError).not.toHaveBeenCalled();
       }
 
-      expect(getVisibleChildren(container)).toEqual(
+      expect(getMeaningfulChildren(container)).toEqual(
         <div>
           <div>
             <span>Hello</span>
@@ -1653,7 +1746,7 @@ describe('ReactDOMFizzServer', () => {
       }
     }
 
-    await act(async () => {
+    await actIntoContainer(async () => {
       const {pipe} = renderToPipeableStream(
         <TestProvider ctx="A">
           <div>
@@ -1668,15 +1761,15 @@ describe('ReactDOMFizzServer', () => {
       );
       pipe(writable);
     });
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <div>
         Loading: <b>A</b>
       </div>,
     );
-    await act(async () => {
+    await actIntoContainer(async () => {
       resolveText('Hello: ');
     });
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <div>
         Hello: <b>B</b>
         <b>A</b>
@@ -1710,7 +1803,7 @@ describe('ReactDOMFizzServer', () => {
       );
     }
 
-    await act(async () => {
+    await actIntoContainer(async () => {
       const {pipe} = renderToPipeableStream(
         <div>
           <PrintA />
@@ -1729,15 +1822,15 @@ describe('ReactDOMFizzServer', () => {
       );
       pipe(writable);
     });
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <div>
         A0<div>Loading...</div>A0
       </div>,
     );
-    await act(async () => {
+    await actIntoContainer(async () => {
       resolveText('Child:');
     });
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <div>
         A0
         <div>
@@ -1771,7 +1864,7 @@ describe('ReactDOMFizzServer', () => {
     }
 
     const loggedErrors = [];
-    await act(async () => {
+    await actIntoContainer(async () => {
       const {pipe} = renderToPipeableStream(
         <div>
           <PrintA />
@@ -1803,7 +1896,7 @@ describe('ReactDOMFizzServer', () => {
     });
     expect(loggedErrors.length).toBe(1);
     expect(loggedErrors[0].message).toEqual('A0.1.1');
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <div>
         A0
         <div>
@@ -1839,7 +1932,7 @@ describe('ReactDOMFizzServer', () => {
     loggedErrors.length = 0;
 
     let controls;
-    await act(async () => {
+    await actIntoContainer(async () => {
       controls = renderToPipeableStream(
         <App isClient={false} />,
 
@@ -1862,12 +1955,12 @@ describe('ReactDOMFizzServer', () => {
     Scheduler.unstable_flushAll();
 
     // We're still loading because we're waiting for the server to stream more content.
-    expect(getVisibleChildren(container)).toEqual('Loading root...');
+    expect(getMeaningfulChildren(container)).toEqual('Loading root...');
 
     expect(loggedErrors).toEqual([]);
 
     // Error the content, but we don't have a fallback yet.
-    await act(async () => {
+    await actIntoContainer(async () => {
       rejectText('Hello', theError);
     });
 
@@ -1875,15 +1968,15 @@ describe('ReactDOMFizzServer', () => {
 
     // We still can't render it on the client because we haven't unblocked the parent.
     Scheduler.unstable_flushAll();
-    expect(getVisibleChildren(container)).toEqual('Loading root...');
+    expect(getMeaningfulChildren(container)).toEqual('Loading root...');
 
     // Unblock the loading state
-    await act(async () => {
+    await actIntoContainer(async () => {
       resolveText('Loading...');
     });
 
     // Now we're able to show the inner boundary.
-    expect(getVisibleChildren(container)).toEqual(<div>Loading...</div>);
+    expect(getMeaningfulChildren(container)).toEqual(<div>Loading...</div>);
 
     // That will let us client render it instead.
     expect(Scheduler).toFlushAndYield([]);
@@ -1912,7 +2005,7 @@ describe('ReactDOMFizzServer', () => {
     );
 
     // The client rendered HTML is now in place.
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <div>
         <h1>Hello</h1>
       </div>,
@@ -1922,7 +2015,7 @@ describe('ReactDOMFizzServer', () => {
   });
 
   it('should be able to abort the fallback if the main content finishes first', async () => {
-    await act(async () => {
+    await actIntoContainer(async () => {
       const {pipe} = renderToPipeableStream(
         <Suspense fallback={<Text text="Loading Outer" />}>
           <div>
@@ -1940,14 +2033,14 @@ describe('ReactDOMFizzServer', () => {
       );
       pipe(writable);
     });
-    expect(getVisibleChildren(container)).toEqual('Loading Outer');
+    expect(getMeaningfulChildren(container)).toEqual('Loading Outer');
     // We should have received a partial segment containing the a partial of the fallback.
     expect(container.innerHTML).toContain('Inner');
-    await act(async () => {
+    await actIntoContainer(async () => {
       resolveText('Hello');
     });
     // We should've been able to display the content without waiting for the rest of the fallback.
-    expect(getVisibleChildren(container)).toEqual(<div>Hello</div>);
+    expect(getMeaningfulChildren(container)).toEqual(<div>Hello</div>);
   });
 
   // @gate enableSuspenseAvoidThisFallbackFizz
@@ -2019,21 +2112,21 @@ describe('ReactDOMFizzServer', () => {
 
     await jest.runAllTimers();
 
-    await act(async () => {
+    await actIntoContainer(async () => {
       const {pipe} = renderToPipeableStream(<App isClient={false} />);
       pipe(writable);
     });
 
     // Nothing is output since root has a suspense with avoidedThisFallback that hasn't resolved
-    expect(getVisibleChildren(container)).toEqual(undefined);
+    expect(getMeaningfulChildren(container)).toEqual(undefined);
     expect(container.innerHTML).not.toContain('Avoided Fallback');
 
     // resolve first suspense component with avoidThisFallback
-    await act(async () => {
+    await actIntoContainer(async () => {
       promiseRes[0]();
     });
 
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <div>
         Non Suspense Content
         <div>resolved 0</div>
@@ -2043,11 +2136,11 @@ describe('ReactDOMFizzServer', () => {
 
     expect(container.innerHTML).not.toContain('Avoided Fallback2');
 
-    await act(async () => {
+    await actIntoContainer(async () => {
       promiseRes[1]();
     });
 
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <div>
         Non Suspense Content
         <div>resolved 0</div>
@@ -2058,14 +2151,14 @@ describe('ReactDOMFizzServer', () => {
     );
 
     let root;
-    await act(async () => {
+    await actIntoContainer(async () => {
       root = ReactDOMClient.hydrateRoot(container, <App isClient={false} />);
       Scheduler.unstable_flushAll();
       await jest.runAllTimers();
     });
 
     // No change after hydration
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <div>
         Non Suspense Content
         <div>resolved 0</div>
@@ -2075,7 +2168,7 @@ describe('ReactDOMFizzServer', () => {
       </div>,
     );
 
-    await act(async () => {
+    await actIntoContainer(async () => {
       // Trigger update by changing isClient to true
       root.render(<App isClient={true} />);
       Scheduler.unstable_flushAll();
@@ -2083,7 +2176,7 @@ describe('ReactDOMFizzServer', () => {
     });
 
     // Now that we've resuspended at the root we show the root fallback
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <div>
         Non Suspense Content
         <div style="display: none;">resolved 0</div>
@@ -2129,7 +2222,7 @@ describe('ReactDOMFizzServer', () => {
     }
 
     const loggedErrors = [];
-    await act(async () => {
+    await actIntoContainer(async () => {
       const {pipe} = renderToPipeableStream(
         <Suspense fallback="Loading...">
           <App />
@@ -2171,7 +2264,7 @@ describe('ReactDOMFizzServer', () => {
       ],
       {withoutStack: 1},
     );
-    expect(getVisibleChildren(container)).toEqual(<div>client</div>);
+    expect(getMeaningfulChildren(container)).toEqual(<div>client</div>);
   });
 
   // The selector implementation uses the lazy ref initialization pattern
@@ -2214,7 +2307,7 @@ describe('ReactDOMFizzServer', () => {
       );
     }
     const loggedErrors = [];
-    await act(async () => {
+    await actIntoContainer(async () => {
       const {pipe} = renderToPipeableStream(
         <Suspense fallback="Loading...">
           <App />
@@ -2257,7 +2350,7 @@ describe('ReactDOMFizzServer', () => {
       ],
       {withoutStack: 1},
     );
-    expect(getVisibleChildren(container)).toEqual(<div>client</div>);
+    expect(getMeaningfulChildren(container)).toEqual(<div>client</div>);
   });
 
   it(
@@ -2303,7 +2396,7 @@ describe('ReactDOMFizzServer', () => {
         );
       }
 
-      await act(async () => {
+      await actIntoContainer(async () => {
         const {pipe} = renderToPipeableStream(<App />);
         pipe(writable);
       });
@@ -2334,7 +2427,7 @@ describe('ReactDOMFizzServer', () => {
         'An error occurred during hydration. The server HTML was replaced',
         {withoutStack: true},
       );
-      expect(getVisibleChildren(container)).toEqual(<span>Yay!</span>);
+      expect(getMeaningfulChildren(container)).toEqual(<span>Yay!</span>);
 
       // The node that's inside the boundary that errored during hydration was
       // not hydrated.
@@ -2393,7 +2486,7 @@ describe('ReactDOMFizzServer', () => {
         );
       }
 
-      await act(async () => {
+      await actIntoContainer(async () => {
         const {pipe} = renderToPipeableStream(<App />);
         pipe(writable);
       });
@@ -2417,7 +2510,7 @@ describe('ReactDOMFizzServer', () => {
         'Hydration error',
         'There was an error while hydrating this Suspense boundary. Switched to client rendering.',
       ]);
-      expect(getVisibleChildren(container)).toEqual(
+      expect(getMeaningfulChildren(container)).toEqual(
         <div>
           <span />
           <span>Yay!</span>
@@ -2483,7 +2576,7 @@ describe('ReactDOMFizzServer', () => {
         );
       }
 
-      await act(async () => {
+      await actIntoContainer(async () => {
         const {pipe} = renderToPipeableStream(<App />);
         pipe(writable);
       });
@@ -2501,7 +2594,7 @@ describe('ReactDOMFizzServer', () => {
       // Because we failed to recover from the error, onRecoverableError
       // shouldn't be called.
       expect(Scheduler).toFlushAndYield([]);
-      expect(getVisibleChildren(container)).toEqual('Oops!');
+      expect(getMeaningfulChildren(container)).toEqual('Oops!');
 
       expectErrors(errors, [], []);
     },
@@ -2536,7 +2629,7 @@ describe('ReactDOMFizzServer', () => {
         </div>
       );
     }
-    await act(async () => {
+    await actIntoContainer(async () => {
       const {pipe} = renderToPipeableStream(<App />, {
         onError(error) {
           Scheduler.unstable_yieldValue('[s!] ' + error.message);
@@ -2559,7 +2652,7 @@ describe('ReactDOMFizzServer', () => {
     });
     // This should not report any errors yet.
     expect(Scheduler).toFlushAndYield([]);
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <div>
         <p>Loading...</p>
       </div>,
@@ -2573,7 +2666,7 @@ describe('ReactDOMFizzServer', () => {
     expect(serverFallback).toBe(clientFallback);
 
     // When we're able to fully hydrate, we expect a clean client render.
-    await act(async () => {
+    await actIntoContainer(async () => {
       resolveText('Yay!');
     });
     expect(Scheduler).toFlushAndYield([
@@ -2582,7 +2675,7 @@ describe('ReactDOMFizzServer', () => {
         'likely due to an error during server rendering. ' +
         'Switched to client rendering.',
     ]);
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <div>
         <span>Yay!</span>
       </div>,
@@ -2621,7 +2714,7 @@ describe('ReactDOMFizzServer', () => {
           </div>
         );
       }
-      await act(async () => {
+      await actIntoContainer(async () => {
         const {pipe} = renderToPipeableStream(<App color="red" />, {
           onError(error) {
             Scheduler.unstable_yieldValue('[s!] ' + error.message);
@@ -2644,7 +2737,7 @@ describe('ReactDOMFizzServer', () => {
       });
       // This should not report any errors yet.
       expect(Scheduler).toFlushAndYield([]);
-      expect(getVisibleChildren(container)).toEqual(
+      expect(getMeaningfulChildren(container)).toEqual(
         <div>
           <p>Loading...</p>
         </div>,
@@ -2667,7 +2760,7 @@ describe('ReactDOMFizzServer', () => {
       expect(clientFallback2).toBe(serverFallback);
 
       // When we're able to fully hydrate, we expect a clean client render.
-      await act(async () => {
+      await actIntoContainer(async () => {
         resolveText('Yay!');
       });
       expect(Scheduler).toFlushAndYield([
@@ -2677,7 +2770,7 @@ describe('ReactDOMFizzServer', () => {
           'Switched to client rendering.',
         'Yay! (blue)',
       ]);
-      expect(getVisibleChildren(container)).toEqual(
+      expect(getMeaningfulChildren(container)).toEqual(
         <div>
           <span>Yay! (blue)</span>
         </div>,
@@ -2719,7 +2812,7 @@ describe('ReactDOMFizzServer', () => {
         );
       }
 
-      await act(async () => {
+      await actIntoContainer(async () => {
         const {pipe} = renderToPipeableStream(
           <App fallbackText="Loading..." />,
           {
@@ -2748,7 +2841,7 @@ describe('ReactDOMFizzServer', () => {
       );
       // This should not report any errors yet.
       expect(Scheduler).toFlushAndYield([]);
-      expect(getVisibleChildren(container)).toEqual(
+      expect(getMeaningfulChildren(container)).toEqual(
         <div>
           <p>Loading...</p>
         </div>,
@@ -2771,7 +2864,7 @@ describe('ReactDOMFizzServer', () => {
           'likely due to an error during server rendering. ' +
           'Switched to client rendering.',
       ]);
-      expect(getVisibleChildren(container)).toEqual(
+      expect(getMeaningfulChildren(container)).toEqual(
         <div>
           <p>More loading...</p>
         </div>,
@@ -2781,11 +2874,11 @@ describe('ReactDOMFizzServer', () => {
       expect(clientFallback2).not.toBe(clientFallback1);
 
       // Verify we can still do a clean content render after.
-      await act(async () => {
+      await actIntoContainer(async () => {
         resolveText('Yay!');
       });
       expect(Scheduler).toFlushAndYield(['Yay!']);
-      expect(getVisibleChildren(container)).toEqual(
+      expect(getMeaningfulChildren(container)).toEqual(
         <div>
           <span>Yay!</span>
         </div>,
@@ -2848,7 +2941,7 @@ describe('ReactDOMFizzServer', () => {
         );
       }
 
-      await act(async () => {
+      await actIntoContainer(async () => {
         const {pipe} = renderToPipeableStream(<App />);
         pipe(writable);
       });
@@ -2872,7 +2965,7 @@ describe('ReactDOMFizzServer', () => {
         'There was an error while hydrating this Suspense boundary. Switched ' +
           'to client rendering.',
       ]);
-      expect(getVisibleChildren(container)).toEqual(
+      expect(getMeaningfulChildren(container)).toEqual(
         <div>
           <span />
           Loading...
@@ -2880,11 +2973,11 @@ describe('ReactDOMFizzServer', () => {
         </div>,
       );
 
-      await act(async () => {
+      await actIntoContainer(async () => {
         resolveText('Yay!');
       });
       expect(Scheduler).toFlushAndYield(['Yay!']);
-      expect(getVisibleChildren(container)).toEqual(
+      expect(getMeaningfulChildren(container)).toEqual(
         <div>
           <span />
           <span>Yay!</span>
@@ -3000,7 +3093,7 @@ describe('ReactDOMFizzServer', () => {
       );
     }
 
-    await act(async () => {
+    await actIntoContainer(async () => {
       const {pipe} = renderToPipeableStream(<App />);
       pipe(writable);
     });
@@ -3066,12 +3159,12 @@ describe('ReactDOMFizzServer', () => {
       return <span>{context}</span>;
     }
 
-    await act(async () => {
+    await actIntoContainer(async () => {
       const {pipe} = renderToPipeableStream(<Foo />);
       pipe(writable);
     });
 
-    expect(getVisibleChildren(container)).toEqual([
+    expect(getMeaningfulChildren(container)).toEqual([
       <span>hi this is server</span>,
       <span>hi this is server2</span>,
       <span>hi this is server outer</span>,
@@ -3088,11 +3181,11 @@ describe('ReactDOMFizzServer', () => {
       {name: 'b', value: 'b'},
     ]).map(item => <li key={item.get('value')}>{item.get('name')}</li>);
 
-    await act(async () => {
+    await actIntoContainer(async () => {
       const {pipe} = renderToPipeableStream(<ul>{mappedJSX}</ul>);
       pipe(writable);
     });
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <ul>
         <li>a</li>
         <li>b</li>
@@ -3120,7 +3213,7 @@ describe('ReactDOMFizzServer', () => {
 
     let abort;
     const loggedErrors = [];
-    await act(async () => {
+    await actIntoContainer(async () => {
       const {pipe, abort: abortImpl} = renderToPipeableStream(<App />, {
         onError(error) {
           // In this test we contrive erroring with strings so we push the error whereas in most
@@ -3134,14 +3227,14 @@ describe('ReactDOMFizzServer', () => {
     });
 
     expect(loggedErrors).toEqual([]);
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <div>
         <p>p</p>
         <span>span</span>
       </div>,
     );
 
-    await act(() => {
+    await actIntoContainer(() => {
       abort('foobar');
     });
 
@@ -3203,7 +3296,7 @@ describe('ReactDOMFizzServer', () => {
 
     let abort;
     const loggedErrors = [];
-    await act(async () => {
+    await actIntoContainer(async () => {
       const {pipe, abort: abortImpl} = renderToPipeableStream(<App />, {
         onError(error) {
           loggedErrors.push(error.message);
@@ -3215,14 +3308,14 @@ describe('ReactDOMFizzServer', () => {
     });
 
     expect(loggedErrors).toEqual([]);
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <div>
         <p>p</p>
         <span>span</span>
       </div>,
     );
 
-    await act(() => {
+    await actIntoContainer(() => {
       abort(new Error('uh oh'));
     });
 
@@ -3265,7 +3358,7 @@ describe('ReactDOMFizzServer', () => {
   });
 
   it('warns in dev if you access digest from errorInfo in onRecoverableError', async () => {
-    await act(async () => {
+    await actIntoContainer(async () => {
       const {pipe} = renderToPipeableStream(
         <div>
           <Suspense fallback={'loading...'}>
@@ -3281,7 +3374,7 @@ describe('ReactDOMFizzServer', () => {
       rejectText('hello');
       pipe(writable);
     });
-    expect(getVisibleChildren(container)).toEqual(<div>loading...</div>);
+    expect(getMeaningfulChildren(container)).toEqual(<div>loading...</div>);
 
     ReactDOMClient.hydrateRoot(
       container,
@@ -3342,7 +3435,7 @@ describe('ReactDOMFizzServer', () => {
         )}`;
       }
 
-      await act(async () => {
+      await actIntoContainer(async () => {
         const {pipe} = renderToPipeableStream(<App />, {
           onError,
         });
@@ -3390,14 +3483,14 @@ describe('ReactDOMFizzServer', () => {
         )}`;
       }
 
-      await act(async () => {
+      await actIntoContainer(async () => {
         const {pipe} = renderToPipeableStream(<App />, {
           onError,
         });
         pipe(writable);
       });
 
-      await act(() => {
+      await actIntoContainer(() => {
         rejectComponent(new Error(dangerousErrorString));
       });
       expect(window.__outlet).toEqual({});
@@ -3430,7 +3523,7 @@ describe('ReactDOMFizzServer', () => {
       const expectedDigest = onError(theError);
       loggedErrors.length = 0;
 
-      await act(async () => {
+      await actIntoContainer(async () => {
         const {pipe} = renderToPipeableStream(<App />, {
           onError,
         });
@@ -3468,7 +3561,7 @@ describe('ReactDOMFizzServer', () => {
   });
 
   it('accepts an integrity property for bootstrapScripts and bootstrapModules', async () => {
-    await actIntoEmptyDocument(() => {
+    await act(() => {
       const {pipe} = renderToPipeableStream(
         <html>
           <head />
@@ -3502,27 +3595,20 @@ describe('ReactDOMFizzServer', () => {
       pipe(writable);
     });
 
-    expect(getVisibleChildren(document)).toEqual(
+    expect(getMeaningfulChildren(document)).toEqual(
       <html>
         <head />
         <body>
           <div>hello world</div>
+          <script src="foo" async="" />
+          <script src="bar" async="" />
+          <script src="baz" integrity="qux" async="" />
+          <script type="module" src="quux" async="" />
+          <script type="module" src="corge" async="" />
+          <script type="module" src="grault" integrity="garply" async="" />
         </body>
       </html>,
     );
-    expect(
-      stripExternalRuntimeInNodes(
-        document.getElementsByTagName('script'),
-        renderOptions.unstable_externalRuntimeSrc,
-      ).map(n => n.outerHTML),
-    ).toEqual([
-      '<script src="foo" async=""></script>',
-      '<script src="bar" async=""></script>',
-      '<script src="baz" integrity="qux" async=""></script>',
-      '<script type="module" src="quux" async=""></script>',
-      '<script type="module" src="corge" async=""></script>',
-      '<script type="module" src="grault" integrity="garply" async=""></script>',
-    ]);
   });
 
   describe('bootstrapScriptContent escaping', () => {
@@ -3530,7 +3616,7 @@ describe('ReactDOMFizzServer', () => {
       window.__test_outlet = '';
       const stringWithScriptsInIt =
         'prescription pre<scription pre<Scription pre</scRipTion pre</ScripTion </script><script><!-- <script> -->';
-      await act(async () => {
+      await actIntoContainer(async () => {
         const {pipe} = renderToPipeableStream(<div />, {
           bootstrapScriptContent:
             'window.__test_outlet = "This should have been replaced";var x = "' +
@@ -3551,7 +3637,7 @@ describe('ReactDOMFizzServer', () => {
       const el = document.createElement('p');
       el.textContent = '{"one":1,\u2028\u2029"two":2}';
       const stringWithLSAndPSCharacters = el.textContent;
-      await act(async () => {
+      await actIntoContainer(async () => {
         const {pipe} = renderToPipeableStream(<div />, {
           bootstrapScriptContent:
             'let x = ' +
@@ -3572,7 +3658,7 @@ describe('ReactDOMFizzServer', () => {
       window.__test_outlet = null;
       // this boolean expression will be cast to a number due to the bitwise &. we will look for a truthy value (1) below
       const booleanLogicString = '1 < 2 & 3 > 1';
-      await act(async () => {
+      await actIntoContainer(async () => {
         const {pipe} = renderToPipeableStream(<div />, {
           bootstrapScriptContent:
             'let x = ' + booleanLogicString + '; window.__test_outlet = x;',
@@ -3585,7 +3671,7 @@ describe('ReactDOMFizzServer', () => {
 
   // @gate enableFizzExternalRuntime
   it('supports option to load runtime as an external script', async () => {
-    await actIntoEmptyDocument(() => {
+    await act(() => {
       const {pipe} = renderToPipeableStream(
         <html>
           <head />
@@ -3611,7 +3697,9 @@ describe('ReactDOMFizzServer', () => {
       ),
     ).toEqual(['<script src="src-of-external-runtime" async=""></script>']);
 
-    expect(getVisibleChildren(document)).toEqual(
+    expect(
+      getMeaningfulChildren(document, ['src-of-external-runtime']),
+    ).toEqual(
       <html>
         <head />
         <body>loading...</body>
@@ -3632,11 +3720,11 @@ describe('ReactDOMFizzServer', () => {
         </div>
       );
     }
-    await actIntoEmptyDocument(() => {
+    await act(() => {
       const {pipe} = renderToPipeableStream(<App />);
       pipe(writable);
     });
-    await act(async () => {
+    await actIntoContainer(async () => {
       resolveText('Hello');
     });
 
@@ -3645,7 +3733,7 @@ describe('ReactDOMFizzServer', () => {
   });
 
   it('does not send the external runtime for static pages', async () => {
-    await actIntoEmptyDocument(() => {
+    await act(() => {
       const {pipe} = renderToPipeableStream(
         <html>
           <head />
@@ -3697,15 +3785,15 @@ describe('ReactDOMFizzServer', () => {
     };
 
     const [ServerApp, serverResolve] = makeApp();
-    await act(async () => {
+    await actIntoContainer(async () => {
       const {pipe} = renderToPipeableStream(<ServerApp />);
       pipe(writable);
     });
-    await act(() => {
+    await actIntoContainer(() => {
       serverResolve();
     });
 
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <div>
         <p>A</p>
         <h2 name="hello">world</h2>
@@ -3722,7 +3810,7 @@ describe('ReactDOMFizzServer', () => {
     });
     Scheduler.unstable_flushAll();
 
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <div>
         <p>A</p>
         <h2 name="hello">world</h2>
@@ -3733,7 +3821,7 @@ describe('ReactDOMFizzServer', () => {
     // client-side rendering.
     await clientResolve();
     expect(Scheduler).toFlushWithoutYielding();
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <div>
         <p>A</p>
         <h2 name="hello">world</h2>
@@ -3773,15 +3861,15 @@ describe('ReactDOMFizzServer', () => {
     };
 
     const [ServerApp, serverResolve] = makeApp();
-    await act(async () => {
+    await actIntoContainer(async () => {
       const {pipe} = renderToPipeableStream(<ServerApp text="initial" />);
       pipe(writable);
     });
-    await act(() => {
+    await actIntoContainer(() => {
       serverResolve();
     });
 
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <div>
         <p>A</p>
         <h2 name="initial">initial</h2>
@@ -3801,7 +3889,7 @@ describe('ReactDOMFizzServer', () => {
     });
     Scheduler.unstable_flushAll();
 
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <div>
         <p>A</p>
         <h2 name="initial">initial</h2>
@@ -3819,7 +3907,7 @@ describe('ReactDOMFizzServer', () => {
     }).toErrorDev(
       'Warning: Prop `name` did not match. Server: "initial" Client: "replaced"',
     );
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <div>
         <p>A</p>
         <h2 name="replaced">replaced</h2>
@@ -3850,12 +3938,12 @@ describe('ReactDOMFizzServer', () => {
     };
 
     try {
-      await act(async () => {
+      await actIntoContainer(async () => {
         const {pipe} = renderToPipeableStream(<App text="initial" />);
         pipe(writable);
       });
 
-      expect(getVisibleChildren(container)).toEqual(
+      expect(getMeaningfulChildren(container)).toEqual(
         <div>
           <h2>initial</h2>
           <h2>initial</h2>
@@ -3877,7 +3965,7 @@ describe('ReactDOMFizzServer', () => {
         'Logged recoverable error: There was an error while hydrating this Suspense boundary. Switched to client rendering.',
       ]);
 
-      expect(getVisibleChildren(container)).toEqual(
+      expect(getMeaningfulChildren(container)).toEqual(
         <div>
           <h2>replaced</h2>
           <h2>replaced</h2>
@@ -3939,12 +4027,12 @@ describe('ReactDOMFizzServer', () => {
       );
     };
 
-    await act(async () => {
+    await actIntoContainer(async () => {
       const {pipe} = renderToPipeableStream(<App />);
       pipe(writable);
     });
 
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <div>
         <h1>one</h1>
         <h2>two</h2>
@@ -3968,7 +4056,7 @@ describe('ReactDOMFizzServer', () => {
       'Logged recoverable error: There was an error while hydrating this Suspense boundary. Switched to client rendering.',
     ]);
 
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <div>
         <h1>one</h1>
         <h2>two</h2>
@@ -4031,12 +4119,12 @@ describe('ReactDOMFizzServer', () => {
     };
 
     try {
-      await act(async () => {
+      await actIntoContainer(async () => {
         const {pipe} = renderToPipeableStream(<App />);
         pipe(writable);
       });
 
-      expect(getVisibleChildren(container)).toEqual(
+      expect(getMeaningfulChildren(container)).toEqual(
         <div>
           <h1>one</h1>
           <h2>two</h2>
@@ -4076,7 +4164,7 @@ describe('ReactDOMFizzServer', () => {
       ]);
       mockError.mockClear();
 
-      expect(getVisibleChildren(container)).toEqual(
+      expect(getMeaningfulChildren(container)).toEqual(
         <div>
           <h1>one</h1>
           <h2>two</h2>
@@ -4162,12 +4250,12 @@ describe('ReactDOMFizzServer', () => {
     };
 
     try {
-      await act(async () => {
+      await actIntoContainer(async () => {
         const {pipe} = renderToPipeableStream(<App />);
         pipe(writable);
       });
 
-      expect(getVisibleChildren(container)).toEqual(
+      expect(getMeaningfulChildren(container)).toEqual(
         <div>
           <h1>one</h1>
           <h2>two</h2>
@@ -4195,7 +4283,7 @@ describe('ReactDOMFizzServer', () => {
       ]);
       expect(mockError.mock.calls).toEqual([]);
 
-      expect(getVisibleChildren(container)).toEqual(
+      expect(getMeaningfulChildren(container)).toEqual(
         <div>
           <h1>one</h1>
           <h2>two</h2>
@@ -4285,12 +4373,12 @@ describe('ReactDOMFizzServer', () => {
     };
 
     try {
-      await act(async () => {
+      await actIntoContainer(async () => {
         const {pipe} = renderToPipeableStream(<App />);
         pipe(writable);
       });
 
-      expect(getVisibleChildren(container)).toEqual(
+      expect(getMeaningfulChildren(container)).toEqual(
         <div>
           <h1>one</h1>
           <h2>two</h2>
@@ -4324,7 +4412,7 @@ describe('ReactDOMFizzServer', () => {
       ]);
       mockError.mockClear();
 
-      expect(getVisibleChildren(container)).toEqual(
+      expect(getMeaningfulChildren(container)).toEqual(
         <div>
           <h1>one</h1>
           <h2>two</h2>
@@ -4356,7 +4444,7 @@ describe('ReactDOMFizzServer', () => {
         </Suspense>
       );
     }
-    await act(async () => {
+    await actIntoContainer(async () => {
       const {pipe} = renderToPipeableStream(<App />);
       pipe(writable);
     });
@@ -4370,7 +4458,7 @@ describe('ReactDOMFizzServer', () => {
 
     expect(Scheduler).toFlushAndYield([]);
     expect(errors).toEqual([]);
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <div>
         A<b>B</b>
       </div>,
@@ -4379,7 +4467,7 @@ describe('ReactDOMFizzServer', () => {
     resolveText('A');
     expect(Scheduler).toFlushAndYield([]);
     expect(errors).toEqual([]);
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <div>
         A<b>B</b>
       </div>,
@@ -4402,7 +4490,7 @@ describe('ReactDOMFizzServer', () => {
         </div>
       );
     }
-    await act(async () => {
+    await actIntoContainer(async () => {
       const {pipe} = renderToPipeableStream(<App />);
       pipe(writable);
     });
@@ -4416,7 +4504,7 @@ describe('ReactDOMFizzServer', () => {
 
     expect(Scheduler).toFlushAndYield([]);
     expect(errors).toEqual([]);
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <div>
         <p>lazy</p>
         <p>some {'text'}</p>
@@ -4426,7 +4514,7 @@ describe('ReactDOMFizzServer', () => {
     resolve({default: () => <p>lazy</p>});
     expect(Scheduler).toFlushAndYield([]);
     expect(errors).toEqual([]);
-    expect(getVisibleChildren(container)).toEqual(
+    expect(getMeaningfulChildren(container)).toEqual(
       <div>
         <p>lazy</p>
         <p>some {'text'}</p>
@@ -4457,7 +4545,7 @@ describe('ReactDOMFizzServer', () => {
         </body>
       );
     }
-    await actIntoEmptyDocument(() => {
+    await act(() => {
       const {pipe} = renderToPipeableStream(
         <html data-html="html">
           <AsyncNoOutput />
@@ -4467,20 +4555,16 @@ describe('ReactDOMFizzServer', () => {
       );
       pipe(writable);
     });
-    await actIntoEmptyDocument(() => {
+    await act(() => {
       resolveText('body');
     });
-    await actIntoEmptyDocument(() => {
+    await act(() => {
       resolveText('nooutput');
     });
-    // We need to use actIntoEmptyDocument because act assumes that buffered
-    // content should be fake streamed into the body which is normally true
-    // but in this test the entire shell was delayed and we need the initial
-    // construction to be done to get the parsing right
-    await actIntoEmptyDocument(() => {
+    await act(() => {
       resolveText('head');
     });
-    expect(getVisibleChildren(document)).toEqual(
+    expect(getMeaningfulChildren(document)).toEqual(
       <html data-html="html">
         <head data-foo="foo">
           <link rel="preload" as="style" href="foo" />
@@ -4498,7 +4582,7 @@ describe('ReactDOMFizzServer', () => {
       chunks.push(chunk);
     });
 
-    await actIntoEmptyDocument(() => {
+    await act(() => {
       const {pipe} = renderToPipeableStream(
         <html>
           <head />
@@ -4513,7 +4597,7 @@ describe('ReactDOMFizzServer', () => {
       pipe(writable);
     });
 
-    expect(getVisibleChildren(document)).toEqual(
+    expect(getMeaningfulChildren(document)).toEqual(
       <html>
         <head />
         <body>{'first'}</body>
@@ -4524,7 +4608,7 @@ describe('ReactDOMFizzServer', () => {
       resolveText('second');
     });
 
-    expect(getVisibleChildren(document)).toEqual(
+    expect(getMeaningfulChildren(document)).toEqual(
       <html>
         <head />
         <body>
@@ -4555,7 +4639,7 @@ describe('ReactDOMFizzServer', () => {
         );
       }
 
-      await act(async () => {
+      await actIntoContainer(async () => {
         const {pipe} = renderToPipeableStream(<App name="Foo" />);
         pipe(writable);
       });
@@ -4571,7 +4655,7 @@ describe('ReactDOMFizzServer', () => {
       });
       expect(Scheduler).toFlushAndYield([]);
       expect(errors).toEqual([]);
-      expect(getVisibleChildren(container)).toEqual(
+      expect(getMeaningfulChildren(container)).toEqual(
         <div>
           hello<b>world, {'Foo'}</b>!
         </div>,
@@ -4593,7 +4677,7 @@ describe('ReactDOMFizzServer', () => {
         );
       }
 
-      await act(async () => {
+      await actIntoContainer(async () => {
         const {pipe} = renderToPipeableStream(<App name="Foo" />);
         pipe(writable);
       });
@@ -4602,7 +4686,7 @@ describe('ReactDOMFizzServer', () => {
         '<div id="app-div">hello<b>world, <template id="P:1"></template></b>!</div>',
       );
 
-      await act(() => resolveText('Foo'));
+      await actIntoContainer(() => resolveText('Foo'));
 
       const div = stripExternalRuntimeInNodes(
         container.children,
@@ -4633,7 +4717,7 @@ describe('ReactDOMFizzServer', () => {
       });
       expect(Scheduler).toFlushAndYield([]);
       expect(errors).toEqual([]);
-      expect(getVisibleChildren(container)).toEqual(
+      expect(getMeaningfulChildren(container)).toEqual(
         <div id="app-div">
           hello<b>world, {'Foo'}</b>!
         </div>,
@@ -4652,7 +4736,7 @@ describe('ReactDOMFizzServer', () => {
         );
       }
 
-      await act(async () => {
+      await actIntoContainer(async () => {
         const {pipe} = renderToPipeableStream(<App />);
         pipe(writable);
       });
@@ -4661,13 +4745,13 @@ describe('ReactDOMFizzServer', () => {
         '<div id="app-div">h<template id="P:1"></template>w<template id="P:2"></template></div>',
       );
 
-      await act(() => resolveText('orld'));
+      await actIntoContainer(() => resolveText('orld'));
 
       expect(document.getElementById('app-div').outerHTML).toEqual(
         '<div id="app-div">h<template id="P:1"></template>world</div>',
       );
 
-      await act(() => resolveText('ello'));
+      await actIntoContainer(() => resolveText('ello'));
       expect(
         stripExternalRuntimeInNodes(
           container.children,
@@ -4683,7 +4767,7 @@ describe('ReactDOMFizzServer', () => {
       });
       expect(Scheduler).toFlushAndYield([]);
       expect(errors).toEqual([]);
-      expect(getVisibleChildren(container)).toEqual(
+      expect(getMeaningfulChildren(container)).toEqual(
         <div id="app-div">{['h', 'ello', 'w', 'orld']}</div>,
       );
     });
@@ -4700,10 +4784,10 @@ describe('ReactDOMFizzServer', () => {
         );
       }
 
-      await act(async () => {
+      await actIntoContainer(async () => {
         const {pipe} = renderToPipeableStream(<App />);
         await afterImmediate();
-        await act(() => resolveText('ello'));
+        await actIntoContainer(() => resolveText('ello'));
         pipe(writable);
       });
 
@@ -4711,7 +4795,7 @@ describe('ReactDOMFizzServer', () => {
         '<div id="app-div">h<!-- -->ello<!-- -->w<template id="P:1"></template></div>',
       );
 
-      await act(() => resolveText('orld'));
+      await actIntoContainer(() => resolveText('orld'));
 
       expect(
         stripExternalRuntimeInNodes(
@@ -4728,7 +4812,7 @@ describe('ReactDOMFizzServer', () => {
       });
       expect(Scheduler).toFlushAndYield([]);
       expect(errors).toEqual([]);
-      expect(getVisibleChildren(container)).toEqual(
+      expect(getMeaningfulChildren(container)).toEqual(
         <div id="app-div">{['h', 'ello', 'w', 'orld']}</div>,
       );
     });
@@ -4747,10 +4831,10 @@ describe('ReactDOMFizzServer', () => {
         );
       }
 
-      await act(async () => {
+      await actIntoContainer(async () => {
         const {pipe} = renderToPipeableStream(<App />);
         await afterImmediate();
-        await act(() => resolveText('world'));
+        await actIntoContainer(() => resolveText('world'));
         pipe(writable);
       });
 
@@ -4766,7 +4850,7 @@ describe('ReactDOMFizzServer', () => {
       });
       expect(Scheduler).toFlushAndYield([]);
       expect(errors).toEqual([]);
-      expect(getVisibleChildren(container)).toEqual(
+      expect(getMeaningfulChildren(container)).toEqual(
         <div>
           hello<b>world</b>
         </div>,
@@ -4785,10 +4869,10 @@ describe('ReactDOMFizzServer', () => {
         );
       }
 
-      await act(async () => {
+      await actIntoContainer(async () => {
         const {pipe} = renderToPipeableStream(<App />);
         await afterImmediate();
-        await act(() => resolveText('world'));
+        await actIntoContainer(() => resolveText('world'));
         pipe(writable);
       });
 
@@ -4804,7 +4888,7 @@ describe('ReactDOMFizzServer', () => {
       });
       expect(Scheduler).toFlushAndYield([]);
       expect(errors).toEqual([]);
-      expect(getVisibleChildren(container)).toEqual(
+      expect(getMeaningfulChildren(container)).toEqual(
         <div>
           hello<b>world</b>
         </div>,
@@ -4834,10 +4918,10 @@ describe('ReactDOMFizzServer', () => {
         );
       }
 
-      await act(async () => {
+      await actIntoContainer(async () => {
         const {pipe} = renderToPipeableStream(<App />);
         await afterImmediate();
-        await act(() => resolveText('world'));
+        await actIntoContainer(() => resolveText('world'));
         pipe(writable);
       });
 
@@ -4845,7 +4929,7 @@ describe('ReactDOMFizzServer', () => {
         '<div id="app-div">start<!--$?--><template id="B:0"></template>[loading first]<!--/$--><!--$?--><template id="B:1"></template>[loading second]<!--/$-->end</div>',
       );
 
-      await act(async () => {
+      await actIntoContainer(async () => {
         resolveText('first suspended');
       });
 
@@ -4861,7 +4945,7 @@ describe('ReactDOMFizzServer', () => {
       });
       expect(Scheduler).toFlushAndYield([]);
       expect(errors).toEqual([]);
-      expect(getVisibleChildren(container)).toEqual(
+      expect(getMeaningfulChildren(container)).toEqual(
         <div id="app-div">
           {'start'}
           {'firststart'}
@@ -4872,7 +4956,7 @@ describe('ReactDOMFizzServer', () => {
         </div>,
       );
 
-      await act(async () => {
+      await actIntoContainer(async () => {
         resolveText('second suspended');
       });
 
@@ -4887,7 +4971,7 @@ describe('ReactDOMFizzServer', () => {
 
       expect(Scheduler).toFlushAndYield([]);
       expect(errors).toEqual([]);
-      expect(getVisibleChildren(container)).toEqual(
+      expect(getMeaningfulChildren(container)).toEqual(
         <div id="app-div">
           {'start'}
           {'firststart'}
@@ -4924,10 +5008,10 @@ describe('ReactDOMFizzServer', () => {
         );
       }
 
-      await act(async () => {
+      await actIntoContainer(async () => {
         const {pipe} = renderToPipeableStream(<App />);
         await afterImmediate();
-        await act(() => resolveText('world'));
+        await actIntoContainer(() => resolveText('world'));
         pipe(writable);
       });
 
@@ -4943,7 +5027,7 @@ describe('ReactDOMFizzServer', () => {
       });
       expect(Scheduler).toFlushAndYield([]);
       expect(errors).toEqual([]);
-      expect(getVisibleChildren(container)).toEqual(
+      expect(getMeaningfulChildren(container)).toEqual(
         <div>
           {/* first boundary */}
           {'hello'}
@@ -4980,11 +5064,11 @@ describe('ReactDOMFizzServer', () => {
       }
 
       prepareJSDOMForTitle();
-      await act(async () => {
+      await actIntoContainer(async () => {
         const {pipe} = renderToPipeableStream(<App />);
         pipe(writable);
       });
-      expect(getVisibleChildren(container)).toEqual(<title>hello</title>);
+      expect(getMeaningfulChildren(container)).toEqual(<title>hello</title>);
 
       const errors = [];
       ReactDOMClient.hydrateRoot(container, <App />, {
@@ -4994,7 +5078,7 @@ describe('ReactDOMFizzServer', () => {
       });
       expect(Scheduler).toFlushAndYield([]);
       expect(errors).toEqual([]);
-      expect(getVisibleChildren(container)).toEqual(<title>hello</title>);
+      expect(getMeaningfulChildren(container)).toEqual(<title>hello</title>);
     });
 
     it('should accept children array of length 1 containing a string', async () => {
@@ -5004,11 +5088,11 @@ describe('ReactDOMFizzServer', () => {
       }
 
       prepareJSDOMForTitle();
-      await act(async () => {
+      await actIntoContainer(async () => {
         const {pipe} = renderToPipeableStream(<App />);
         pipe(writable);
       });
-      expect(getVisibleChildren(container)).toEqual(<title>hello</title>);
+      expect(getMeaningfulChildren(container)).toEqual(<title>hello</title>);
 
       const errors = [];
       ReactDOMClient.hydrateRoot(container, <App />, {
@@ -5018,7 +5102,7 @@ describe('ReactDOMFizzServer', () => {
       });
       expect(Scheduler).toFlushAndYield([]);
       expect(errors).toEqual([]);
-      expect(getVisibleChildren(container)).toEqual(<title>hello</title>);
+      expect(getMeaningfulChildren(container)).toEqual(<title>hello</title>);
     });
 
     it('should warn in dev when given an array of length 2 or more', async () => {
@@ -5042,7 +5126,7 @@ describe('ReactDOMFizzServer', () => {
       try {
         prepareJSDOMForTitle();
 
-        await act(async () => {
+        await actIntoContainer(async () => {
           const {pipe} = renderToPipeableStream(<App />);
           pipe(writable);
         });
@@ -5061,9 +5145,9 @@ describe('ReactDOMFizzServer', () => {
 
         if (gate(flags => flags.enableFloat)) {
           // This title was invalid so it is not emitted
-          expect(getVisibleChildren(container)).toEqual(undefined);
+          expect(getMeaningfulChildren(container)).toEqual(undefined);
         } else {
-          expect(getVisibleChildren(container)).toEqual(
+          expect(getMeaningfulChildren(container)).toEqual(
             <title>{'hello1<!-- -->hello2'}</title>,
           );
         }
@@ -5078,7 +5162,7 @@ describe('ReactDOMFizzServer', () => {
         if (gate(flags => flags.enableFloat)) {
           expect(errors).toEqual([]);
           // with float, the title doesn't render on the client or on the server
-          expect(getVisibleChildren(container)).toEqual(undefined);
+          expect(getMeaningfulChildren(container)).toEqual(undefined);
         } else {
           expect(errors).toEqual(
             [
@@ -5089,7 +5173,7 @@ describe('ReactDOMFizzServer', () => {
               'There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.',
             ].filter(Boolean),
           );
-          expect(getVisibleChildren(container)).toEqual(
+          expect(getMeaningfulChildren(container)).toEqual(
             <title>{['hello1', 'hello2']}</title>,
           );
         }
@@ -5126,7 +5210,7 @@ describe('ReactDOMFizzServer', () => {
       try {
         prepareJSDOMForTitle();
 
-        await act(async () => {
+        await actIntoContainer(async () => {
           const {pipe} = renderToPipeableStream(<App />);
           pipe(writable);
         });
@@ -5145,11 +5229,13 @@ describe('ReactDOMFizzServer', () => {
 
         if (gate(flags => flags.enableFloat)) {
           // object titles are toStringed when float is on
-          expect(getVisibleChildren(container)).toEqual(
+          expect(getMeaningfulChildren(container)).toEqual(
             <title>{'[object Object]'}</title>,
           );
         } else {
-          expect(getVisibleChildren(container)).toEqual(<title>hello</title>);
+          expect(getMeaningfulChildren(container)).toEqual(
+            <title>hello</title>,
+          );
         }
 
         const errors = [];
@@ -5162,11 +5248,13 @@ describe('ReactDOMFizzServer', () => {
         expect(errors).toEqual([]);
         if (gate(flags => flags.enableFloat)) {
           // object titles are toStringed when float is on
-          expect(getVisibleChildren(container)).toEqual(
+          expect(getMeaningfulChildren(container)).toEqual(
             <title>{'[object Object]'}</title>,
           );
         } else {
-          expect(getVisibleChildren(container)).toEqual(<title>hello</title>);
+          expect(getMeaningfulChildren(container)).toEqual(
+            <title>hello</title>,
+          );
         }
       } finally {
         console.error = originalConsoleError;
@@ -5191,7 +5279,7 @@ describe('ReactDOMFizzServer', () => {
         );
       }
 
-      await act(async () => {
+      await actIntoContainer(async () => {
         const {pipe} = renderToPipeableStream(<App />);
         pipe(writable);
       });
@@ -5202,21 +5290,21 @@ describe('ReactDOMFizzServer', () => {
       // API but we might want to fix this for our own internal tests.
       //
       // For now, wait for each promise in sequence.
-      await act(async () => {
+      await actIntoContainer(async () => {
         await promiseA;
       });
-      await act(async () => {
+      await actIntoContainer(async () => {
         await promiseB;
       });
-      await act(async () => {
+      await actIntoContainer(async () => {
         await promiseC;
       });
 
-      expect(getVisibleChildren(container)).toEqual('ABC');
+      expect(getMeaningfulChildren(container)).toEqual('ABC');
 
       ReactDOMClient.hydrateRoot(container, <App />);
       expect(Scheduler).toFlushAndYield([]);
-      expect(getVisibleChildren(container)).toEqual('ABC');
+      expect(getMeaningfulChildren(container)).toEqual('ABC');
     });
 
     // @gate enableUseHook
@@ -5251,11 +5339,11 @@ describe('ReactDOMFizzServer', () => {
         );
       }
 
-      await act(async () => {
+      await actIntoContainer(async () => {
         const {pipe} = renderToPipeableStream(<App />);
         pipe(writable);
       });
-      expect(getVisibleChildren(container)).toEqual(['AB', 'C']);
+      expect(getMeaningfulChildren(container)).toEqual(['AB', 'C']);
 
       // Hydration uses a different renderer runtime (Fiber instead of Fizz).
       // We reset _currentRenderer here to not trigger a warning about multiple
@@ -5264,7 +5352,7 @@ describe('ReactDOMFizzServer', () => {
       ServerContext._currentRenderer = null;
       ReactDOMClient.hydrateRoot(container, <App />);
       expect(Scheduler).toFlushAndYield([]);
-      expect(getVisibleChildren(container)).toEqual(['AB', 'C']);
+      expect(getMeaningfulChildren(container)).toEqual(['AB', 'C']);
     });
 
     // @gate enableUseHook
@@ -5290,7 +5378,7 @@ describe('ReactDOMFizzServer', () => {
         );
       }
 
-      await act(async () => {
+      await actIntoContainer(async () => {
         const {pipe} = renderToPipeableStream(<App />);
         pipe(writable);
       });
@@ -5301,24 +5389,24 @@ describe('ReactDOMFizzServer', () => {
       // API but we might want to fix this for our own internal tests.
       //
       // For now, wait for each promise in sequence.
-      await act(async () => {
+      await actIntoContainer(async () => {
         await promiseA;
       });
-      await act(async () => {
+      await actIntoContainer(async () => {
         await promiseB;
       });
-      await act(async () => {
+      await actIntoContainer(async () => {
         await promiseC;
       });
-      await act(async () => {
+      await actIntoContainer(async () => {
         await promiseD;
       });
 
-      expect(getVisibleChildren(container)).toEqual('ABCD');
+      expect(getMeaningfulChildren(container)).toEqual('ABCD');
 
       ReactDOMClient.hydrateRoot(container, <App />);
       expect(Scheduler).toFlushAndYield([]);
-      expect(getVisibleChildren(container)).toEqual('ABCD');
+      expect(getMeaningfulChildren(container)).toEqual('ABCD');
     });
 
     // @gate enableUseHook
@@ -5359,7 +5447,7 @@ describe('ReactDOMFizzServer', () => {
       }
 
       const reportedServerErrors = [];
-      await act(async () => {
+      await actIntoContainer(async () => {
         const {pipe} = renderToPipeableStream(<App />, {
           onError(error) {
             reportedServerErrors.push(error);
@@ -5374,17 +5462,17 @@ describe('ReactDOMFizzServer', () => {
       // API but we might want to fix this for our own internal tests.
       //
       // For now, wait for each promise in sequence.
-      await act(async () => {
+      await actIntoContainer(async () => {
         await promiseA;
       });
-      await act(async () => {
+      await actIntoContainer(async () => {
         await expect(promiseB).rejects.toThrow('Oops!');
       });
-      await act(async () => {
+      await actIntoContainer(async () => {
         await promiseC;
       });
 
-      expect(getVisibleChildren(container)).toEqual('Loading...');
+      expect(getMeaningfulChildren(container)).toEqual('Loading...');
       expect(reportedServerErrors.length).toBe(1);
       expect(reportedServerErrors[0].message).toBe('Oops!');
 
@@ -5395,7 +5483,7 @@ describe('ReactDOMFizzServer', () => {
         },
       });
       expect(Scheduler).toFlushAndYield([]);
-      expect(getVisibleChildren(container)).toEqual('Oops!');
+      expect(getMeaningfulChildren(container)).toEqual('Oops!');
       expect(reportedClientErrors.length).toBe(1);
       if (__DEV__) {
         expect(reportedClientErrors[0].message).toBe('Oops!');
@@ -5420,15 +5508,15 @@ describe('ReactDOMFizzServer', () => {
         return use(thenable);
       }
 
-      await act(async () => {
+      await actIntoContainer(async () => {
         const {pipe} = renderToPipeableStream(<App />);
         pipe(writable);
       });
-      expect(getVisibleChildren(container)).toEqual('Hi');
+      expect(getMeaningfulChildren(container)).toEqual('Hi');
 
       ReactDOMClient.hydrateRoot(container, <App />);
       expect(Scheduler).toFlushAndYield([]);
-      expect(getVisibleChildren(container)).toEqual('Hi');
+      expect(getMeaningfulChildren(container)).toEqual('Hi');
     });
 
     // @gate enableUseHook
@@ -5451,11 +5539,11 @@ describe('ReactDOMFizzServer', () => {
       }
       // Because the thenable resolves synchronously, we should be able to finish
       // rendering synchronously, with no fallback.
-      await act(async () => {
+      await actIntoContainer(async () => {
         const {pipe} = renderToPipeableStream(<App />);
         pipe(writable);
       });
-      expect(getVisibleChildren(container)).toEqual('Hi');
+      expect(getMeaningfulChildren(container)).toEqual('Hi');
     });
   });
 
@@ -5474,21 +5562,21 @@ describe('ReactDOMFizzServer', () => {
           </button>
         );
       }
-      await act(async () => {
+      await actIntoContainer(async () => {
         const {pipe} = renderToPipeableStream(<App />);
         pipe(writable);
       });
-      expect(getVisibleChildren(container)).toEqual(<button>0</button>);
+      expect(getMeaningfulChildren(container)).toEqual(<button>0</button>);
 
       ReactDOMClient.hydrateRoot(container, <App />);
       expect(Scheduler).toFlushAndYield([]);
-      expect(getVisibleChildren(container)).toEqual(<button>0</button>);
+      expect(getMeaningfulChildren(container)).toEqual(<button>0</button>);
 
       ref.current.dispatchEvent(
         new window.MouseEvent('click', {bubbles: true}),
       );
       await jest.runAllTimers();
-      expect(getVisibleChildren(container)).toEqual(<button>1</button>);
+      expect(getMeaningfulChildren(container)).toEqual(<button>1</button>);
     });
 
     // @gate enableUseEffectEventHook
@@ -5505,7 +5593,7 @@ describe('ReactDOMFizzServer', () => {
       const reportedServerErrors = [];
       let caughtError;
       try {
-        await act(async () => {
+        await actIntoContainer(async () => {
           const {pipe} = renderToPipeableStream(<App />, {
             onError(e) {
               reportedServerErrors.push(e);
@@ -5534,11 +5622,11 @@ describe('ReactDOMFizzServer', () => {
           return <span />;
         }
       }
-      await act(async () => {
+      await actIntoContainer(async () => {
         const {pipe} = renderToPipeableStream(<App />);
         pipe(writable);
       });
-      expect(getVisibleChildren(container)).toEqual(<div />);
+      expect(getMeaningfulChildren(container)).toEqual(<div />);
 
       const errors = [];
       ReactDOMClient.hydrateRoot(container, <App />, {
@@ -5556,12 +5644,12 @@ describe('ReactDOMFizzServer', () => {
         {withoutStack: 1},
       );
       expect(errors.length).toEqual(2);
-      expect(getVisibleChildren(container)).toEqual(<span />);
+      expect(getMeaningfulChildren(container)).toEqual(<span />);
     });
   });
 
   it('can render scripts with simple children', async () => {
-    await actIntoEmptyDocument(async () => {
+    await act(async () => {
       const {pipe} = renderToPipeableStream(
         <html>
           <body>
@@ -5589,7 +5677,7 @@ describe('ReactDOMFizzServer', () => {
     };
 
     try {
-      await actIntoEmptyDocument(async () => {
+      await act(async () => {
         const {pipe} = renderToPipeableStream(
           <html>
             <body>
@@ -5633,4 +5721,405 @@ describe('ReactDOMFizzServer', () => {
       console.error = originalConsoleError;
     }
   });
+
+  describe('renderIntoContainer', () => {
+    // @gate enableFloat && enableFizzIntoContainer
+    it('can render into a container', async () => {
+      await act(() => {
+        const {pipe} = renderIntoContainerAsPipeableStream(
+          <div>foo</div>,
+          'container',
+        );
+        pipe(writable);
+      });
+
+      expect(getMeaningfulChildren(document)).toEqual(
+        <html>
+          <head />
+          <body>
+            <div id="container">
+              <div>foo</div>
+            </div>
+          </body>
+        </html>,
+      );
+    });
+
+    // @gate enableFloat && enableFizzIntoContainer
+    it('can render into a container with style resources', async () => {
+      await act(() => {
+        const {pipe} = renderIntoContainerAsPipeableStream(
+          <div>
+            foo
+            <link rel="stylesheet" href="foo" precedence="foo" />
+          </div>,
+          'container',
+        );
+        pipe(writable);
+      });
+
+      expect(getMeaningfulChildren(document)).toEqual(
+        <html>
+          <head>
+            <link rel="stylesheet" href="foo" data-precedence="foo" />
+          </head>
+          <body>
+            <div id="container" />
+            <link rel="preload" href="foo" as="style" />
+          </body>
+        </html>,
+      );
+
+      await act(() => {
+        loadStylesheets();
+      });
+
+      expect(getMeaningfulChildren(document)).toEqual(
+        <html>
+          <head>
+            <link rel="stylesheet" href="foo" data-precedence="foo" />
+          </head>
+          <body>
+            <div id="container">
+              <div>foo</div>
+            </div>
+            <link rel="preload" href="foo" as="style" />
+          </body>
+        </html>,
+      );
+    });
+
+    // @gate enableFloat && enableFizzIntoContainer
+    it('bootstraps after completing the Root Boundary', async () => {
+      let didBootstrap = false;
+      function bootstrap() {
+        didBootstrap = true;
+      }
+      window.__INIT__ = bootstrap;
+
+      await act(() => {
+        const {pipe} = renderIntoContainerAsPipeableStream(
+          <div>foo</div>,
+          'container',
+          {
+            bootstrapScriptContent: '__INIT__();',
+          },
+        );
+        pipe(writable);
+        expect(didBootstrap).toBe(false);
+      });
+
+      expect(getMeaningfulChildren(document)).toEqual(
+        <html>
+          <head />
+          <body>
+            <div id="container">
+              <div>foo</div>
+            </div>
+          </body>
+        </html>,
+      );
+      expect(didBootstrap).toBe(true);
+    });
+
+    // @gate enableFloat && enableFizzIntoContainer
+    it('emits non-stylesheet resources eagerly in place', async () => {
+      await act(() => {
+        const {pipe} = renderIntoContainerAsPipeableStream(
+          <div>
+            <link rel="preload" href="foo" as="style" />
+            <script async={true} src="bar" />
+            <AsyncText text="foo" />
+          </div>,
+          'container',
+        );
+        pipe(writable);
+      });
+
+      expect(getMeaningfulChildren(document)).toEqual(
+        <html>
+          <head />
+          <body>
+            <div id="container" />
+            <script async="" src="bar" />
+            <link rel="preload" href="foo" as="style" />
+          </body>
+        </html>,
+      );
+
+      await act(() => {
+        resolveText('foo');
+      });
+
+      expect(getMeaningfulChildren(document)).toEqual(
+        <html>
+          <head />
+          <body>
+            <div id="container">
+              <div>foo</div>
+            </div>
+            <script async="" src="bar" />
+            <link rel="preload" href="foo" as="style" />
+          </body>
+        </html>,
+      );
+    });
+
+    // @gate enableFloat && enableFizzIntoContainer
+    it('emits fallback bootstrap scripts when the Root Boundary errors', async () => {
+      let didBootstrap = false;
+      function bootstrap() {
+        didBootstrap = true;
+      }
+      window.__INIT__ = bootstrap;
+
+      let didFallback = false;
+      function fallback() {
+        didFallback = true;
+      }
+      window.__FALLBACK__ = fallback;
+
+      function Err() {
+        throw new Error('uh oh');
+      }
+
+      const errors = [];
+      function onError(err) {
+        errors.push(err.message);
+      }
+      await act(() => {
+        const {pipe} = renderIntoContainerAsPipeableStream(
+          <div>
+            <link rel="preload" href="foo" as="style" />
+            <script async={true} src="bar" />
+            <Err />
+          </div>,
+          'container',
+          {
+            onError,
+            bootstrapScriptContent: '__INIT__();',
+            fallbackBootstrapScriptContent: '__FALLBACK__()',
+          },
+        );
+        pipe(writable);
+        expect(didBootstrap).toBe(false);
+        expect(didFallback).toBe(false);
+      });
+
+      expect(getMeaningfulChildren(document)).toEqual(
+        <html>
+          <head />
+          <body>
+            <div id="container" />
+            <script async="" src="bar" />
+            <link rel="preload" href="foo" as="style" />
+          </body>
+        </html>,
+      );
+      expect(errors).toEqual(['uh oh']);
+      expect(didBootstrap).toBe(false);
+      expect(didFallback).toBe(true);
+    });
+
+    // @gate enableFloat && enableFizzIntoContainer
+    it('emits regular bootstrap scripts when the Root Boundary errors if no fallback scripts were provided', async () => {
+      let didBootstrap = false;
+      function bootstrap() {
+        didBootstrap = true;
+      }
+      window.__INIT__ = bootstrap;
+
+      function Err() {
+        throw new Error('uh oh');
+      }
+
+      const errors = [];
+      function onError(err) {
+        errors.push(err.message);
+      }
+      await act(() => {
+        const {pipe} = renderIntoContainerAsPipeableStream(
+          <div>
+            <link rel="preload" href="foo" as="style" />
+            <script async={true} src="bar" />
+            <Err />
+          </div>,
+          'container',
+          {
+            onError,
+            bootstrapScriptContent: '__INIT__();',
+          },
+        );
+        pipe(writable);
+        expect(didBootstrap).toBe(false);
+      });
+
+      expect(getMeaningfulChildren(document)).toEqual(
+        <html>
+          <head />
+          <body>
+            <div id="container" />
+            <script async="" src="bar" />
+            <link rel="preload" href="foo" as="style" />
+          </body>
+        </html>,
+      );
+      expect(errors).toEqual(['uh oh']);
+      expect(didBootstrap).toBe(true);
+    });
+
+    // @gate enableFloat && enableFizzIntoContainer
+    it('can delay bootstrapping hydration until stylesheets load', async () => {
+      let didBootstrap = false;
+      function bootstrap() {
+        didBootstrap = true;
+      }
+      window.__INIT__ = bootstrap;
+
+      await act(() => {
+        const {pipe} = renderIntoContainerAsPipeableStream(
+          <div>
+            foo
+            <link rel="stylesheet" href="foo" precedence="default" />
+          </div>,
+          'container',
+          {
+            bootstrapScriptContent: '__INIT__();',
+          },
+        );
+        pipe(writable);
+      });
+
+      expect(didBootstrap).toBe(false);
+
+      await act(() => {
+        loadStylesheets();
+      });
+
+      expect(didBootstrap).toBe(true);
+
+      const errors = [];
+      ReactDOMClient.hydrateRoot(
+        document.getElementById('container'),
+        <div>bar</div>,
+        {
+          onRecoverableError(err, errInfo) {
+            if (errInfo.componentStack) {
+              errors.push([
+                err.message,
+                normalizeCodeLocInfo(errInfo.componentStack),
+              ]);
+            } else {
+              errors.push(err.message);
+            }
+          },
+        },
+      );
+      if (gate(flags => flags.enableClientRenderFallbackOnTextMismatch)) {
+        expect(() => {
+          expect(Scheduler).toFlushWithoutYielding();
+        }).toErrorDev(
+          [
+            'Warning: Text content did not match. Server: "foo" Client: "bar"',
+            'Warning: An error occurred during hydration. The server HTML was replaced with client content in <div>',
+          ],
+          {withoutStack: 1},
+        );
+        expect(errors).toEqual([
+          [
+            'Text content does not match server-rendered HTML.',
+            componentStack(['div']),
+          ],
+          'There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.',
+        ]);
+      } else {
+        expect(() => {
+          expect(Scheduler).toFlushWithoutYielding();
+        }).toErrorDev([
+          'Warning: Text content did not match. Server: "foo" Client: "bar"',
+        ]);
+        expect(errors).toEqual([]);
+      }
+
+      expect(getMeaningfulChildren(document)).toEqual(
+        <html>
+          <head>
+            <link rel="stylesheet" href="foo" data-precedence="default" />
+          </head>
+          <body>
+            <div id="container">
+              <div>bar</div>
+            </div>
+            <link rel="preload" href="foo" as="style" />
+          </body>
+        </html>,
+      );
+    });
+
+    // @gate enableFloat && enableFizzIntoContainer
+    it('can delay bootstrapping until stylesheets error', async () => {
+      let didBootstrap = false;
+      function bootstrap() {
+        didBootstrap = true;
+      }
+      window.__INIT__ = bootstrap;
+
+      await act(() => {
+        const {pipe} = renderIntoContainerAsPipeableStream(
+          <div>
+            foo
+            <link rel="stylesheet" href="foo" precedence="default" />
+            <link rel="stylesheet" href="bar" precedence="default" />
+          </div>,
+          'container',
+          {
+            bootstrapScriptContent: '__INIT__();',
+          },
+        );
+        pipe(writable);
+      });
+
+      expect(didBootstrap).toBe(false);
+      expect(getMeaningfulChildren(document)).toEqual(
+        <html>
+          <head>
+            <link rel="stylesheet" href="foo" data-precedence="default" />
+            <link rel="stylesheet" href="bar" data-precedence="default" />
+          </head>
+          <body>
+            <div id="container" />
+            <link rel="preload" href="foo" as="style" />
+            <link rel="preload" href="bar" as="style" />
+          </body>
+        </html>,
+      );
+
+      await actIntoContainer(() => {
+        errorStylesheets('foo');
+      });
+
+      expect(didBootstrap).toBe(true);
+
+      ReactDOMClient.hydrateRoot(
+        document.getElementById('container'),
+        <div>foo</div>,
+      );
+      expect(Scheduler).toFlushWithoutYielding();
+      expect(getMeaningfulChildren(document)).toEqual(
+        <html>
+          <head>
+            <link rel="stylesheet" href="foo" data-precedence="default" />
+            <link rel="stylesheet" href="bar" data-precedence="default" />
+          </head>
+          <body>
+            <div id="container">
+              <div>foo</div>
+            </div>
+            <link rel="preload" href="foo" as="style" />
+            <link rel="preload" href="bar" as="style" />
+          </body>
+        </html>,
+      );
+    });
+  });
 });
diff --git a/packages/react-dom/src/__tests__/ReactDOMFizzServerBrowser-test.js b/packages/react-dom/src/__tests__/ReactDOMFizzServerBrowser-test.js
index fc795649ee956..d1091136ed6c1 100644
--- a/packages/react-dom/src/__tests__/ReactDOMFizzServerBrowser-test.js
+++ b/packages/react-dom/src/__tests__/ReactDOMFizzServerBrowser-test.js
@@ -9,20 +9,41 @@
 
 'use strict';
 
+import {replaceScriptsAndMove} from '../test-utils/FizzTestUtils';
+
 // Polyfills for test environment
 global.ReadableStream = require('web-streams-polyfill/ponyfill/es6').ReadableStream;
 global.TextEncoder = require('util').TextEncoder;
 
+let JSDOM;
+let window;
+let document;
 let React;
 let ReactDOMFizzServer;
 let Suspense;
+let buffer;
+let lastBodyChild;
 
 describe('ReactDOMFizzServerBrowser', () => {
   beforeEach(() => {
     jest.resetModules();
+    JSDOM = require('jsdom').JSDOM;
     React = require('react');
     ReactDOMFizzServer = require('react-dom/server.browser');
     Suspense = React.Suspense;
+
+    // Test Environment
+    const jsdom = new JSDOM(
+      '<!DOCTYPE html><html><head></head><body><div id="container">',
+      {
+        runScripts: 'dangerously',
+      },
+    );
+    window = jsdom.window;
+    document = jsdom.window.document;
+
+    buffer = '';
+    lastBodyChild = null;
   });
 
   const theError = new Error('This is an error');
@@ -46,6 +67,105 @@ describe('ReactDOMFizzServerBrowser', () => {
     }
   }
 
+  async function readIntoBuffer(stream) {
+    const reader = stream.getReader();
+    while (true) {
+      const {done, value} = await reader.read();
+      if (done) {
+        return;
+      }
+      buffer += Buffer.from(value).toString('utf8');
+    }
+  }
+
+  function getMeaningfulChildren(element) {
+    const children = [];
+    let node = element.firstChild;
+    while (node) {
+      if (node.nodeType === 1) {
+        if (
+          // some tags are ambiguous and might be hidden because they look like non-meaningful children
+          // so we have a global override where if this data attribute is included we also include the node
+          node.hasAttribute('data-meaningful') ||
+          (node.tagName === 'SCRIPT' &&
+            node.hasAttribute('src') &&
+            node.hasAttribute('async')) ||
+          (node.tagName !== 'SCRIPT' &&
+            node.tagName !== 'TEMPLATE' &&
+            node.tagName !== 'template' &&
+            !node.hasAttribute('hidden') &&
+            !node.hasAttribute('aria-hidden'))
+        ) {
+          const props = {};
+          const attributes = node.attributes;
+          for (let i = 0; i < attributes.length; i++) {
+            if (
+              attributes[i].name === 'id' &&
+              attributes[i].value.includes(':')
+            ) {
+              // We assume this is a React added ID that's a non-visual implementation detail.
+              continue;
+            }
+            props[attributes[i].name] = attributes[i].value;
+          }
+          props.children = getMeaningfulChildren(node);
+          children.push(React.createElement(node.tagName.toLowerCase(), props));
+        }
+      } else if (node.nodeType === 3) {
+        children.push(node.data);
+      }
+      node = node.nextSibling;
+    }
+    return children.length === 0
+      ? undefined
+      : children.length === 1
+      ? children[0]
+      : children;
+  }
+
+  async function act(callback) {
+    await callback();
+    // Await one turn around the event loop.
+    // This assumes that we'll flush everything we have so far.
+    await new Promise(resolve => {
+      setImmediate(resolve);
+    });
+
+    // if new nodes were added to the document during the callback for instance via
+    // runtime instrunctions resolving (insertStyles). the newly added nodes may need to be
+    // re-added so scripts can run
+    if (lastBodyChild) {
+      let next = null;
+      const toMove = [];
+      while ((next = lastBodyChild.nextSibling)) {
+        toMove.push(next);
+        next.parentNode.removeChild(next);
+      }
+      toMove.forEach(node =>
+        replaceScriptsAndMove(window, null, node, document.body),
+      );
+    }
+
+    // JSDOM doesn't support stream HTML parser so we need to give it a proper fragment.
+    // We also want to execute any scripts that are embedded.
+    // We assume that we have now received a proper fragment of HTML.
+    const bufferedContent = buffer;
+    buffer = '';
+    const fakeBody = document.createElement('body');
+    fakeBody.innerHTML = bufferedContent;
+    const parent = document.body;
+    while (fakeBody.firstChild) {
+      const node = fakeBody.firstChild;
+      await replaceScriptsAndMove(window, null /* CSPNonce */, node, parent);
+
+      if (node.nextSibling) {
+        console.log('node.nextSibling', node.nextSibling);
+      }
+    }
+
+    lastBodyChild = document.body.lastChild;
+  }
+
   it('should call renderToReadableStream', async () => {
     const stream = await ReactDOMFizzServer.renderToReadableStream(
       <div>hello world</div>,
@@ -501,4 +621,28 @@ describe('ReactDOMFizzServerBrowser', () => {
       '<!DOCTYPE html><html><head><title>foo</title></head><body>bar</body></html>',
     );
   });
+
+  describe('renderIntoContainer', () => {
+    // @gate enableFloat && enableFizzIntoContainer
+    it('can render into a container with a stream that is synchronously available', async () => {
+      await act(() => {
+        const stream = ReactDOMFizzServer.renderIntoContainer(
+          <div>foo</div>,
+          'container',
+        );
+        readIntoBuffer(stream);
+      });
+
+      expect(getMeaningfulChildren(document)).toEqual(
+        <html>
+          <head />
+          <body>
+            <div id="container">
+              <div>foo</div>
+            </div>
+          </body>
+        </html>,
+      );
+    });
+  });
 });
diff --git a/packages/react-dom/src/__tests__/ReactDOMFizzServerNode-test.js b/packages/react-dom/src/__tests__/ReactDOMFizzServerNode-test.js
index a5b2b5ac417a8..3b3b42b2525fa 100644
--- a/packages/react-dom/src/__tests__/ReactDOMFizzServerNode-test.js
+++ b/packages/react-dom/src/__tests__/ReactDOMFizzServerNode-test.js
@@ -628,4 +628,24 @@ describe('ReactDOMFizzServerNode', () => {
     expect(rendered).toBe(false);
     expect(isComplete).toBe(true);
   });
+
+  describe('renderIntoContainerAsPipeableStream', () => {
+    // @gate enableFloat && enableFizzIntoContainer
+    it('can render into a container', async () => {
+      const {writable, output} = getTestWritable();
+      const {pipe} = ReactDOMFizzServer.renderIntoContainerAsPipeableStream(
+        <div>foo</div>,
+        'container',
+      );
+      pipe(writable);
+      jest.runAllTimers();
+
+      // This is a weak tests but we really are just asserting that the flushing semantics follow Root Boundary style
+      // when using renderIntoContainerAsPipeableStream. The actual assertions for how Root Boundaries behave
+      // is tested elsewhere
+      expect(
+        output.result.startsWith('<div hidden id="S:0"><div>foo</div></div>'),
+      ).toBe(true);
+    });
+  });
 });
diff --git a/packages/react-dom/src/__tests__/ReactDOMFloat-test.js b/packages/react-dom/src/__tests__/ReactDOMFloat-test.js
index b216700671cca..30373bbdf91b9 100644
--- a/packages/react-dom/src/__tests__/ReactDOMFloat-test.js
+++ b/packages/react-dom/src/__tests__/ReactDOMFloat-test.js
@@ -2645,7 +2645,7 @@ describe('ReactDOMFloat', () => {
 
     expect(suspenseInstance.data).toEqual('$!');
     expect(boundaryTemplateInstance.dataset.dgst).toBe(
-      'Resource failed to load',
+      'Stylesheet failed to load.',
     );
 
     expect(getMeaningfulChildren(document)).toEqual(
@@ -2685,7 +2685,7 @@ describe('ReactDOMFloat', () => {
     );
     expect(errors).toEqual([
       'The server could not finish this Suspense boundary, likely due to an error during server rendering. Switched to client rendering.',
-      'Resource failed to load',
+      'Stylesheet failed to load.',
     ]);
   });
 
diff --git a/packages/react-dom/src/server/ReactDOMFizzServerBrowser.fb.js b/packages/react-dom/src/server/ReactDOMFizzServerBrowser.fb.js
new file mode 100644
index 0000000000000..45ee152ab5d02
--- /dev/null
+++ b/packages/react-dom/src/server/ReactDOMFizzServerBrowser.fb.js
@@ -0,0 +1,14 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow
+ */
+
+export {
+  renderIntoContainer,
+  renderToReadableStream,
+  version,
+} from './ReactDOMFizzServerBrowserImpl';
diff --git a/packages/react-dom/src/server/ReactDOMFizzServerBrowser.js b/packages/react-dom/src/server/ReactDOMFizzServerBrowser.js
index 59576a127ea78..45ee152ab5d02 100644
--- a/packages/react-dom/src/server/ReactDOMFizzServerBrowser.js
+++ b/packages/react-dom/src/server/ReactDOMFizzServerBrowser.js
@@ -7,110 +7,8 @@
  * @flow
  */
 
-import type {ReactNodeList} from 'shared/ReactTypes';
-import type {BootstrapScriptDescriptor} from 'react-dom-bindings/src/server/ReactDOMServerFormatConfig';
-
-import ReactVersion from 'shared/ReactVersion';
-
-import {
-  createRequest,
-  startWork,
-  startFlowing,
-  abort,
-} from 'react-server/src/ReactFizzServer';
-
-import {
-  createResponseState,
-  createRootFormatContext,
-} from 'react-dom-bindings/src/server/ReactDOMServerFormatConfig';
-
-type Options = {
-  identifierPrefix?: string,
-  namespaceURI?: string,
-  nonce?: string,
-  bootstrapScriptContent?: string,
-  bootstrapScripts?: Array<string | BootstrapScriptDescriptor>,
-  bootstrapModules?: Array<string | BootstrapScriptDescriptor>,
-  progressiveChunkSize?: number,
-  signal?: AbortSignal,
-  onError?: (error: mixed) => ?string,
-  unstable_externalRuntimeSrc?: string | BootstrapScriptDescriptor,
-};
-
-// TODO: Move to sub-classing ReadableStream.
-type ReactDOMServerReadableStream = ReadableStream & {
-  allReady: Promise<void>,
-};
-
-function renderToReadableStream(
-  children: ReactNodeList,
-  options?: Options,
-): Promise<ReactDOMServerReadableStream> {
-  return new Promise((resolve, reject) => {
-    let onFatalError;
-    let onAllReady;
-    const allReady = new Promise((res, rej) => {
-      onAllReady = res;
-      onFatalError = rej;
-    });
-
-    function onShellReady() {
-      const stream: ReactDOMServerReadableStream = (new ReadableStream(
-        {
-          type: 'bytes',
-          pull: (controller): ?Promise<void> => {
-            startFlowing(request, controller);
-          },
-          cancel: (reason): ?Promise<void> => {
-            abort(request);
-          },
-        },
-        // $FlowFixMe size() methods are not allowed on byte streams.
-        {highWaterMark: 0},
-      ): any);
-      // TODO: Move to sub-classing ReadableStream.
-      stream.allReady = allReady;
-      resolve(stream);
-    }
-    function onShellError(error: mixed) {
-      // If the shell errors the caller of `renderToReadableStream` won't have access to `allReady`.
-      // However, `allReady` will be rejected by `onFatalError` as well.
-      // So we need to catch the duplicate, uncatchable fatal error in `allReady` to prevent a `UnhandledPromiseRejection`.
-      allReady.catch(() => {});
-      reject(error);
-    }
-    const request = createRequest(
-      children,
-      createResponseState(
-        options ? options.identifierPrefix : undefined,
-        options ? options.nonce : undefined,
-        options ? options.bootstrapScriptContent : undefined,
-        options ? options.bootstrapScripts : undefined,
-        options ? options.bootstrapModules : undefined,
-        options ? options.unstable_externalRuntimeSrc : undefined,
-      ),
-      createRootFormatContext(options ? options.namespaceURI : undefined),
-      options ? options.progressiveChunkSize : undefined,
-      options ? options.onError : undefined,
-      onAllReady,
-      onShellReady,
-      onShellError,
-      onFatalError,
-    );
-    if (options && options.signal) {
-      const signal = options.signal;
-      if (signal.aborted) {
-        abort(request, (signal: any).reason);
-      } else {
-        const listener = () => {
-          abort(request, (signal: any).reason);
-          signal.removeEventListener('abort', listener);
-        };
-        signal.addEventListener('abort', listener);
-      }
-    }
-    startWork(request);
-  });
-}
-
-export {renderToReadableStream, ReactVersion as version};
+export {
+  renderIntoContainer,
+  renderToReadableStream,
+  version,
+} from './ReactDOMFizzServerBrowserImpl';
diff --git a/packages/react-dom/src/server/ReactDOMFizzServerBrowser.stable.js b/packages/react-dom/src/server/ReactDOMFizzServerBrowser.stable.js
new file mode 100644
index 0000000000000..0b51735cc6cfe
--- /dev/null
+++ b/packages/react-dom/src/server/ReactDOMFizzServerBrowser.stable.js
@@ -0,0 +1,10 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow
+ */
+
+export {renderToReadableStream, version} from './ReactDOMFizzServerBrowserImpl';
diff --git a/packages/react-dom/src/server/ReactDOMFizzServerBrowserImpl.js b/packages/react-dom/src/server/ReactDOMFizzServerBrowserImpl.js
new file mode 100644
index 0000000000000..1a87c6baa61e1
--- /dev/null
+++ b/packages/react-dom/src/server/ReactDOMFizzServerBrowserImpl.js
@@ -0,0 +1,203 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow
+ */
+
+import type {ReactNodeList} from 'shared/ReactTypes';
+import type {BootstrapScriptDescriptor} from 'react-dom-bindings/src/server/ReactDOMServerFormatConfig';
+
+import ReactVersion from 'shared/ReactVersion';
+
+import {
+  createRequest,
+  startWork,
+  startFlowing,
+  abort,
+} from 'react-server/src/ReactFizzServer';
+
+import {
+  createResponseState,
+  createRootFormatContext,
+  createRootBoundaryID,
+} from 'react-dom-bindings/src/server/ReactDOMServerFormatConfig';
+
+type Options = {
+  identifierPrefix?: string,
+  namespaceURI?: string,
+  nonce?: string,
+  bootstrapScriptContent?: string,
+  bootstrapScripts?: Array<string | BootstrapScriptDescriptor>,
+  bootstrapModules?: Array<string | BootstrapScriptDescriptor>,
+  progressiveChunkSize?: number,
+  signal?: AbortSignal,
+  onError?: (error: mixed) => ?string,
+  unstable_externalRuntimeSrc?: string | BootstrapScriptDescriptor,
+};
+
+// TODO: Move to sub-classing ReadableStream.
+type ReactDOMServerReadableStream = ReadableStream & {
+  allReady: Promise<void>,
+};
+
+function renderToReadableStream(
+  children: ReactNodeList,
+  options?: Options,
+): Promise<ReactDOMServerReadableStream> {
+  return new Promise((resolve, reject) => {
+    let onFatalError;
+    let onAllReady;
+    const allReady = new Promise((res, rej) => {
+      onAllReady = res;
+      onFatalError = rej;
+    });
+
+    function onShellReady() {
+      const stream: ReactDOMServerReadableStream = (new ReadableStream(
+        {
+          type: 'bytes',
+          pull: (controller): ?Promise<void> => {
+            startFlowing(request, controller);
+          },
+          cancel: (reason): ?Promise<void> => {
+            abort(request);
+          },
+        },
+        // $FlowFixMe size() methods are not allowed on byte streams.
+        {highWaterMark: 0},
+      ): any);
+      // TODO: Move to sub-classing ReadableStream.
+      stream.allReady = allReady;
+      resolve(stream);
+    }
+    function onShellError(error: mixed) {
+      // If the shell errors the caller of `renderToReadableStream` won't have access to `allReady`.
+      // However, `allReady` will be rejected by `onFatalError` as well.
+      // So we need to catch the duplicate, uncatchable fatal error in `allReady` to prevent a `UnhandledPromiseRejection`.
+      allReady.catch(() => {});
+      reject(error);
+    }
+    const request = createRequest(
+      children,
+      createResponseState(
+        options ? options.identifierPrefix : undefined,
+        options ? options.nonce : undefined,
+        options ? options.bootstrapScriptContent : undefined,
+        options ? options.bootstrapScripts : undefined,
+        options ? options.bootstrapModules : undefined,
+        undefined, // fallbackBootstrapScriptContent
+        undefined, // fallbackBootstrapScripts
+        undefined, // fallbackBootstrapModules
+        options ? options.unstable_externalRuntimeSrc : undefined,
+      ),
+      createRootFormatContext(options ? options.namespaceURI : undefined),
+      options ? options.progressiveChunkSize : undefined,
+      options ? options.onError : undefined,
+      onAllReady,
+      onShellReady,
+      onShellError,
+      onFatalError,
+      undefined, // rootBoundaryID
+    );
+    if (options && options.signal) {
+      const signal = options.signal;
+      if (signal.aborted) {
+        abort(request, (signal: any).reason);
+      } else {
+        const listener = () => {
+          abort(request, (signal: any).reason);
+          signal.removeEventListener('abort', listener);
+        };
+        signal.addEventListener('abort', listener);
+      }
+    }
+    startWork(request);
+  });
+}
+
+type IntoContainerOptions = {
+  identifierPrefix?: string,
+  namespaceURI?: string,
+  nonce?: string,
+  bootstrapScriptContent?: string,
+  bootstrapScripts?: Array<string | BootstrapScriptDescriptor>,
+  bootstrapModules?: Array<string | BootstrapScriptDescriptor>,
+  fallbackBootstrapScriptContent?: string,
+  fallbackBootstrapScripts?: Array<string | BootstrapScriptDescriptor>,
+  fallbackBootstrapModules?: Array<string | BootstrapScriptDescriptor>,
+  progressiveChunkSize?: number,
+  signal?: AbortSignal,
+  onError?: (error: mixed) => ?string,
+  unstable_externalRuntimeSrc?: string | BootstrapScriptDescriptor,
+};
+
+function renderIntoContainer(
+  children: ReactNodeList,
+  containerID: string,
+  options?: IntoContainerOptions,
+): ReactDOMServerReadableStream {
+  let onFatalError;
+  let onAllReady;
+  const allReady = new Promise((res, rej) => {
+    onAllReady = res;
+    onFatalError = rej;
+  });
+
+  const request = createRequest(
+    children,
+    createResponseState(
+      options ? options.identifierPrefix : undefined,
+      options ? options.nonce : undefined,
+      options ? options.bootstrapScriptContent : undefined,
+      options ? options.bootstrapScripts : undefined,
+      options ? options.bootstrapModules : undefined,
+      options ? options.fallbackBootstrapScriptContent : undefined,
+      options ? options.fallbackBootstrapScripts : undefined,
+      options ? options.fallbackBootstrapModules : undefined,
+      options ? options.unstable_externalRuntimeSrc : undefined,
+    ),
+    createRootFormatContext(options ? options.namespaceURI : undefined),
+    options ? options.progressiveChunkSize : undefined,
+    options ? options.onError : undefined,
+    onAllReady,
+    undefined, // onShellReady
+    undefined, // onShellError
+    onFatalError,
+    createRootBoundaryID(containerID),
+  );
+  if (options && options.signal) {
+    const signal = options.signal;
+    if (signal.aborted) {
+      abort(request, (signal: any).reason);
+    } else {
+      const listener = () => {
+        abort(request, (signal: any).reason);
+        signal.removeEventListener('abort', listener);
+      };
+      signal.addEventListener('abort', listener);
+    }
+  }
+  startWork(request);
+
+  const stream: ReactDOMServerReadableStream = (new ReadableStream(
+    {
+      type: 'bytes',
+      pull: (controller): ?Promise<void> => {
+        startFlowing(request, controller);
+      },
+      cancel: (reason): ?Promise<void> => {
+        abort(request);
+      },
+    },
+    // $FlowFixMe size() methods are not allowed on byte streams.
+    {highWaterMark: 0},
+  ): any);
+  stream.allReady = allReady;
+
+  return stream;
+}
+
+export {renderToReadableStream, renderIntoContainer, ReactVersion as version};
diff --git a/packages/react-dom/src/server/ReactDOMFizzServerBun.fb.js b/packages/react-dom/src/server/ReactDOMFizzServerBun.fb.js
new file mode 100644
index 0000000000000..f42144ad49ff8
--- /dev/null
+++ b/packages/react-dom/src/server/ReactDOMFizzServerBun.fb.js
@@ -0,0 +1,16 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow
+ */
+
+export {
+  renderIntoContainer,
+  renderToReadableStream,
+  renderToNodeStream,
+  renderToStaticNodeStream,
+  version,
+} from './ReactDOMFizzServerBunImpl';
diff --git a/packages/react-dom/src/server/ReactDOMFizzServerBun.js b/packages/react-dom/src/server/ReactDOMFizzServerBun.js
index afa168c000ada..f42144ad49ff8 100644
--- a/packages/react-dom/src/server/ReactDOMFizzServerBun.js
+++ b/packages/react-dom/src/server/ReactDOMFizzServerBun.js
@@ -7,130 +7,10 @@
  * @flow
  */
 
-import type {ReactNodeList} from 'shared/ReactTypes';
-import type {BootstrapScriptDescriptor} from 'react-dom-bindings/src/server/ReactDOMServerFormatConfig';
-
-import ReactVersion from 'shared/ReactVersion';
-
-import {
-  createRequest,
-  startWork,
-  startFlowing,
-  abort,
-} from 'react-server/src/ReactFizzServer';
-
-import {
-  createResponseState,
-  createRootFormatContext,
-} from 'react-dom-bindings/src/server/ReactDOMServerFormatConfig';
-
-type Options = {
-  identifierPrefix?: string,
-  namespaceURI?: string,
-  nonce?: string,
-  bootstrapScriptContent?: string,
-  bootstrapScripts?: Array<string | BootstrapScriptDescriptor>,
-  bootstrapModules?: Array<string | BootstrapScriptDescriptor>,
-  progressiveChunkSize?: number,
-  signal?: AbortSignal,
-  onError?: (error: mixed) => ?string,
-  unstable_externalRuntimeSrc?: string | BootstrapScriptDescriptor,
-};
-
-// TODO: Move to sub-classing ReadableStream.
-type ReactDOMServerReadableStream = ReadableStream & {
-  allReady: Promise<void>,
-};
-
-function renderToReadableStream(
-  children: ReactNodeList,
-  options?: Options,
-): Promise<ReactDOMServerReadableStream> {
-  return new Promise((resolve, reject) => {
-    let onFatalError;
-    let onAllReady;
-    const allReady = new Promise((res, rej) => {
-      onAllReady = res;
-      onFatalError = rej;
-    });
-
-    function onShellReady() {
-      const stream: ReactDOMServerReadableStream = (new ReadableStream(
-        {
-          type: 'direct',
-          pull: (controller): ?Promise<void> => {
-            // $FlowIgnore
-            startFlowing(request, controller);
-          },
-          cancel: (reason): ?Promise<void> => {
-            abort(request);
-          },
-        },
-        // $FlowFixMe size() methods are not allowed on byte streams.
-        {highWaterMark: 2048},
-      ): any);
-      // TODO: Move to sub-classing ReadableStream.
-      stream.allReady = allReady;
-      resolve(stream);
-    }
-    function onShellError(error: mixed) {
-      // If the shell errors the caller of `renderToReadableStream` won't have access to `allReady`.
-      // However, `allReady` will be rejected by `onFatalError` as well.
-      // So we need to catch the duplicate, uncatchable fatal error in `allReady` to prevent a `UnhandledPromiseRejection`.
-      allReady.catch(() => {});
-      reject(error);
-    }
-    const request = createRequest(
-      children,
-      createResponseState(
-        options ? options.identifierPrefix : undefined,
-        options ? options.nonce : undefined,
-        options ? options.bootstrapScriptContent : undefined,
-        options ? options.bootstrapScripts : undefined,
-        options ? options.bootstrapModules : undefined,
-        options ? options.unstable_externalRuntimeSrc : undefined,
-      ),
-      createRootFormatContext(options ? options.namespaceURI : undefined),
-      options ? options.progressiveChunkSize : undefined,
-      options ? options.onError : undefined,
-      onAllReady,
-      onShellReady,
-      onShellError,
-      onFatalError,
-    );
-    if (options && options.signal) {
-      const signal = options.signal;
-      if (signal.aborted) {
-        abort(request, (signal: any).reason);
-      } else {
-        const listener = () => {
-          abort(request, (signal: any).reason);
-          signal.removeEventListener('abort', listener);
-        };
-        signal.addEventListener('abort', listener);
-      }
-    }
-    startWork(request);
-  });
-}
-
-function renderToNodeStream() {
-  throw new Error(
-    'ReactDOMServer.renderToNodeStream(): The Node Stream API is not available ' +
-      'in Bun. Use ReactDOMServer.renderToReadableStream() instead.',
-  );
-}
-
-function renderToStaticNodeStream() {
-  throw new Error(
-    'ReactDOMServer.renderToStaticNodeStream(): The Node Stream API is not available ' +
-      'in Bun. Use ReactDOMServer.renderToReadableStream() instead.',
-  );
-}
-
 export {
+  renderIntoContainer,
   renderToReadableStream,
   renderToNodeStream,
   renderToStaticNodeStream,
-  ReactVersion as version,
-};
+  version,
+} from './ReactDOMFizzServerBunImpl';
diff --git a/packages/react-dom/src/server/ReactDOMFizzServerBun.stable.js b/packages/react-dom/src/server/ReactDOMFizzServerBun.stable.js
new file mode 100644
index 0000000000000..e983c944f7dbc
--- /dev/null
+++ b/packages/react-dom/src/server/ReactDOMFizzServerBun.stable.js
@@ -0,0 +1,15 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow
+ */
+
+export {
+  renderToReadableStream,
+  renderToNodeStream,
+  renderToStaticNodeStream,
+  version,
+} from './ReactDOMFizzServerBunImpl';
diff --git a/packages/react-dom/src/server/ReactDOMFizzServerBunImpl.js b/packages/react-dom/src/server/ReactDOMFizzServerBunImpl.js
new file mode 100644
index 0000000000000..a90f79ccc237e
--- /dev/null
+++ b/packages/react-dom/src/server/ReactDOMFizzServerBunImpl.js
@@ -0,0 +1,227 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow
+ */
+
+import type {ReactNodeList} from 'shared/ReactTypes';
+import type {BootstrapScriptDescriptor} from 'react-dom-bindings/src/server/ReactDOMServerFormatConfig';
+
+import ReactVersion from 'shared/ReactVersion';
+
+import {
+  createRequest,
+  startWork,
+  startFlowing,
+  abort,
+} from 'react-server/src/ReactFizzServer';
+
+import {
+  createResponseState,
+  createRootFormatContext,
+  createRootBoundaryID,
+} from 'react-dom-bindings/src/server/ReactDOMServerFormatConfig';
+
+type Options = {
+  identifierPrefix?: string,
+  namespaceURI?: string,
+  nonce?: string,
+  bootstrapScriptContent?: string,
+  bootstrapScripts?: Array<string | BootstrapScriptDescriptor>,
+  bootstrapModules?: Array<string | BootstrapScriptDescriptor>,
+  progressiveChunkSize?: number,
+  signal?: AbortSignal,
+  onError?: (error: mixed) => ?string,
+  unstable_externalRuntimeSrc?: string | BootstrapScriptDescriptor,
+};
+
+// TODO: Move to sub-classing ReadableStream.
+type ReactDOMServerReadableStream = ReadableStream & {
+  allReady: Promise<void>,
+};
+
+function renderToReadableStream(
+  children: ReactNodeList,
+  options?: Options,
+): Promise<ReactDOMServerReadableStream> {
+  return new Promise((resolve, reject) => {
+    let onFatalError;
+    let onAllReady;
+    const allReady = new Promise((res, rej) => {
+      onAllReady = res;
+      onFatalError = rej;
+    });
+
+    function onShellReady() {
+      const stream: ReactDOMServerReadableStream = (new ReadableStream(
+        {
+          type: 'direct',
+          pull: (controller): ?Promise<void> => {
+            // $FlowIgnore
+            startFlowing(request, controller);
+          },
+          cancel: (reason): ?Promise<void> => {
+            abort(request);
+          },
+        },
+        // $FlowFixMe size() methods are not allowed on byte streams.
+        {highWaterMark: 2048},
+      ): any);
+      // TODO: Move to sub-classing ReadableStream.
+      stream.allReady = allReady;
+      resolve(stream);
+    }
+    function onShellError(error: mixed) {
+      // If the shell errors the caller of `renderToReadableStream` won't have access to `allReady`.
+      // However, `allReady` will be rejected by `onFatalError` as well.
+      // So we need to catch the duplicate, uncatchable fatal error in `allReady` to prevent a `UnhandledPromiseRejection`.
+      allReady.catch(() => {});
+      reject(error);
+    }
+    const request = createRequest(
+      children,
+      createResponseState(
+        options ? options.identifierPrefix : undefined,
+        options ? options.nonce : undefined,
+        options ? options.bootstrapScriptContent : undefined,
+        options ? options.bootstrapScripts : undefined,
+        options ? options.bootstrapModules : undefined,
+        undefined, // fallbackBootstrapScriptContent
+        undefined, // fallbackBootstrapScripts
+        undefined, // fallbackBootstrapModules
+        options ? options.unstable_externalRuntimeSrc : undefined,
+      ),
+      createRootFormatContext(options ? options.namespaceURI : undefined),
+      options ? options.progressiveChunkSize : undefined,
+      options ? options.onError : undefined,
+      onAllReady,
+      onShellReady,
+      onShellError,
+      onFatalError,
+      undefined, // rootBoundaryID
+    );
+    if (options && options.signal) {
+      const signal = options.signal;
+      if (signal.aborted) {
+        abort(request, (signal: any).reason);
+      } else {
+        const listener = () => {
+          abort(request, (signal: any).reason);
+          signal.removeEventListener('abort', listener);
+        };
+        signal.addEventListener('abort', listener);
+      }
+    }
+    startWork(request);
+  });
+}
+
+type IntoContainerOptions = {
+  identifierPrefix?: string,
+  namespaceURI?: string,
+  nonce?: string,
+  bootstrapScriptContent?: string,
+  bootstrapScripts?: Array<string | BootstrapScriptDescriptor>,
+  bootstrapModules?: Array<string | BootstrapScriptDescriptor>,
+  fallbackBootstrapScriptContent?: string,
+  fallbackBootstrapScripts?: Array<string | BootstrapScriptDescriptor>,
+  fallbackBootstrapModules?: Array<string | BootstrapScriptDescriptor>,
+  progressiveChunkSize?: number,
+  signal?: AbortSignal,
+  onError?: (error: mixed) => ?string,
+  unstable_externalRuntimeSrc?: string | BootstrapScriptDescriptor,
+};
+
+function renderIntoContainer(
+  children: ReactNodeList,
+  containerID: string,
+  options?: IntoContainerOptions,
+): Promise<ReactDOMServerReadableStream> {
+  return new Promise((resolve, reject) => {
+    let onFatalError;
+    let onAllReady;
+    const allReady = new Promise((res, rej) => {
+      onAllReady = res;
+      onFatalError = rej;
+    });
+
+    const request = createRequest(
+      children,
+      createResponseState(
+        options ? options.identifierPrefix : undefined,
+        options ? options.nonce : undefined,
+        options ? options.bootstrapScriptContent : undefined,
+        options ? options.bootstrapScripts : undefined,
+        options ? options.bootstrapModules : undefined,
+        options ? options.fallbackBootstrapScriptContent : undefined,
+        options ? options.fallbackBootstrapScripts : undefined,
+        options ? options.fallbackBootstrapModules : undefined,
+        options ? options.unstable_externalRuntimeSrc : undefined,
+      ),
+      createRootFormatContext(options ? options.namespaceURI : undefined),
+      options ? options.progressiveChunkSize : undefined,
+      options ? options.onError : undefined,
+      onAllReady,
+      undefined, // onShellReady
+      undefined, // onShellError
+      onFatalError,
+      createRootBoundaryID(containerID),
+    );
+    if (options && options.signal) {
+      const signal = options.signal;
+      if (signal.aborted) {
+        abort(request, (signal: any).reason);
+      } else {
+        const listener = () => {
+          abort(request, (signal: any).reason);
+          signal.removeEventListener('abort', listener);
+        };
+        signal.addEventListener('abort', listener);
+      }
+    }
+    startWork(request);
+
+    const stream: ReactDOMServerReadableStream = (new ReadableStream(
+      {
+        type: 'direct',
+        pull: (controller): ?Promise<void> => {
+          // $FlowIgnore
+          startFlowing(request, controller);
+        },
+        cancel: (reason): ?Promise<void> => {
+          abort(request);
+        },
+      },
+      // $FlowFixMe size() methods are not allowed on byte streams.
+      {highWaterMark: 2048},
+    ): any);
+    // TODO: Move to sub-classing ReadableStream.
+    stream.allReady = allReady;
+    return stream;
+  });
+}
+
+function renderToNodeStream() {
+  throw new Error(
+    'ReactDOMServer.renderToNodeStream(): The Node Stream API is not available ' +
+      'in Bun. Use ReactDOMServer.renderToReadableStream() instead.',
+  );
+}
+
+function renderToStaticNodeStream() {
+  throw new Error(
+    'ReactDOMServer.renderToStaticNodeStream(): The Node Stream API is not available ' +
+      'in Bun. Use ReactDOMServer.renderToReadableStream() instead.',
+  );
+}
+
+export {
+  renderToReadableStream,
+  renderIntoContainer,
+  renderToNodeStream,
+  renderToStaticNodeStream,
+  ReactVersion as version,
+};
diff --git a/packages/react-dom/src/server/ReactDOMFizzServerNode.fb.js b/packages/react-dom/src/server/ReactDOMFizzServerNode.fb.js
new file mode 100644
index 0000000000000..eecdc78f6cb92
--- /dev/null
+++ b/packages/react-dom/src/server/ReactDOMFizzServerNode.fb.js
@@ -0,0 +1,14 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow
+ */
+
+export {
+  renderIntoContainerAsPipeableStream,
+  renderToPipeableStream,
+  version,
+} from './ReactDOMFizzServerNodeImpl';
diff --git a/packages/react-dom/src/server/ReactDOMFizzServerNode.js b/packages/react-dom/src/server/ReactDOMFizzServerNode.js
index 7fa6d6a9cc0b4..eecdc78f6cb92 100644
--- a/packages/react-dom/src/server/ReactDOMFizzServerNode.js
+++ b/packages/react-dom/src/server/ReactDOMFizzServerNode.js
@@ -7,112 +7,8 @@
  * @flow
  */
 
-import type {Request} from 'react-server/src/ReactFizzServer';
-import type {ReactNodeList} from 'shared/ReactTypes';
-import type {Writable} from 'stream';
-import type {BootstrapScriptDescriptor} from 'react-dom-bindings/src/server/ReactDOMServerFormatConfig';
-import type {Destination} from 'react-server/src/ReactServerStreamConfigNode';
-
-import ReactVersion from 'shared/ReactVersion';
-
-import {
-  createRequest,
-  startWork,
-  startFlowing,
-  abort,
-} from 'react-server/src/ReactFizzServer';
-
-import {
-  createResponseState,
-  createRootFormatContext,
-} from 'react-dom-bindings/src/server/ReactDOMServerFormatConfig';
-
-function createDrainHandler(destination: Destination, request: Request) {
-  return () => startFlowing(request, destination);
-}
-
-function createAbortHandler(request: Request, reason: string) {
-  // eslint-disable-next-line react-internal/prod-error-codes
-  return () => abort(request, new Error(reason));
-}
-
-type Options = {
-  identifierPrefix?: string,
-  namespaceURI?: string,
-  nonce?: string,
-  bootstrapScriptContent?: string,
-  bootstrapScripts?: Array<string | BootstrapScriptDescriptor>,
-  bootstrapModules?: Array<string | BootstrapScriptDescriptor>,
-  progressiveChunkSize?: number,
-  onShellReady?: () => void,
-  onShellError?: (error: mixed) => void,
-  onAllReady?: () => void,
-  onError?: (error: mixed) => ?string,
-  unstable_externalRuntimeSrc?: string | BootstrapScriptDescriptor,
-};
-
-type PipeableStream = {
-  // Cancel any pending I/O and put anything remaining into
-  // client rendered mode.
-  abort(reason: mixed): void,
-  pipe<T: Writable>(destination: T): T,
-};
-
-function createRequestImpl(children: ReactNodeList, options: void | Options) {
-  return createRequest(
-    children,
-    createResponseState(
-      options ? options.identifierPrefix : undefined,
-      options ? options.nonce : undefined,
-      options ? options.bootstrapScriptContent : undefined,
-      options ? options.bootstrapScripts : undefined,
-      options ? options.bootstrapModules : undefined,
-      options ? options.unstable_externalRuntimeSrc : undefined,
-    ),
-    createRootFormatContext(options ? options.namespaceURI : undefined),
-    options ? options.progressiveChunkSize : undefined,
-    options ? options.onError : undefined,
-    options ? options.onAllReady : undefined,
-    options ? options.onShellReady : undefined,
-    options ? options.onShellError : undefined,
-    undefined,
-  );
-}
-
-function renderToPipeableStream(
-  children: ReactNodeList,
-  options?: Options,
-): PipeableStream {
-  const request = createRequestImpl(children, options);
-  let hasStartedFlowing = false;
-  startWork(request);
-  return {
-    pipe<T: Writable>(destination: T): T {
-      if (hasStartedFlowing) {
-        throw new Error(
-          'React currently only supports piping to one writable stream.',
-        );
-      }
-      hasStartedFlowing = true;
-      startFlowing(request, destination);
-      destination.on('drain', createDrainHandler(destination, request));
-      destination.on(
-        'error',
-        createAbortHandler(
-          request,
-          'The destination stream errored while writing data.',
-        ),
-      );
-      destination.on(
-        'close',
-        createAbortHandler(request, 'The destination stream closed early.'),
-      );
-      return destination;
-    },
-    abort(reason: mixed) {
-      abort(request, reason);
-    },
-  };
-}
-
-export {renderToPipeableStream, ReactVersion as version};
+export {
+  renderIntoContainerAsPipeableStream,
+  renderToPipeableStream,
+  version,
+} from './ReactDOMFizzServerNodeImpl';
diff --git a/packages/react-dom/src/server/ReactDOMFizzServerNode.stable.js b/packages/react-dom/src/server/ReactDOMFizzServerNode.stable.js
new file mode 100644
index 0000000000000..111957fabaa25
--- /dev/null
+++ b/packages/react-dom/src/server/ReactDOMFizzServerNode.stable.js
@@ -0,0 +1,10 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow
+ */
+
+export {renderToPipeableStream, version} from './ReactDOMFizzServerNodeImpl';
diff --git a/packages/react-dom/src/server/ReactDOMFizzServerNodeImpl.js b/packages/react-dom/src/server/ReactDOMFizzServerNodeImpl.js
new file mode 100644
index 0000000000000..cc48a7bdb4353
--- /dev/null
+++ b/packages/react-dom/src/server/ReactDOMFizzServerNodeImpl.js
@@ -0,0 +1,197 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow
+ */
+
+import type {Request} from 'react-server/src/ReactFizzServer';
+import type {ReactNodeList} from 'shared/ReactTypes';
+import type {Writable} from 'stream';
+import type {BootstrapScriptDescriptor} from 'react-dom-bindings/src/server/ReactDOMServerFormatConfig';
+import type {Destination} from 'react-server/src/ReactServerStreamConfigNode';
+
+import ReactVersion from 'shared/ReactVersion';
+
+import {
+  createRequest,
+  startWork,
+  startFlowing,
+  abort,
+} from 'react-server/src/ReactFizzServer';
+
+import {
+  createResponseState,
+  createRootFormatContext,
+  createRootBoundaryID,
+} from 'react-dom-bindings/src/server/ReactDOMServerFormatConfig';
+
+function createDrainHandler(destination: Destination, request: Request) {
+  return () => startFlowing(request, destination);
+}
+
+function createAbortHandler(request: Request, reason: string) {
+  // eslint-disable-next-line react-internal/prod-error-codes
+  return () => abort(request, new Error(reason));
+}
+
+type PipeableStream = {
+  // Cancel any pending I/O and put anything remaining into
+  // client rendered mode.
+  abort(reason: mixed): void,
+  pipe<T: Writable>(destination: T): T,
+};
+
+type ToPipeableOptions = {
+  identifierPrefix?: string,
+  namespaceURI?: string,
+  nonce?: string,
+  bootstrapScriptContent?: string,
+  bootstrapScripts?: Array<string | BootstrapScriptDescriptor>,
+  bootstrapModules?: Array<string | BootstrapScriptDescriptor>,
+  progressiveChunkSize?: number,
+  onShellReady?: () => void,
+  onShellError?: (error: mixed) => void,
+  onAllReady?: () => void,
+  onError?: (error: mixed) => ?string,
+  unstable_externalRuntimeSrc?: string | BootstrapScriptDescriptor,
+};
+
+function renderToPipeableStream(
+  children: ReactNodeList,
+  options?: ToPipeableOptions,
+): PipeableStream {
+  const request = createRequest(
+    children,
+    createResponseState(
+      options ? options.identifierPrefix : undefined,
+      options ? options.nonce : undefined,
+      options ? options.bootstrapScriptContent : undefined,
+      options ? options.bootstrapScripts : undefined,
+      options ? options.bootstrapModules : undefined,
+      undefined, // fallbackBootstrapScriptContent
+      undefined, // fallbackBootstrapScripts
+      undefined, // fallbackBootstrapModules
+      options ? options.unstable_externalRuntimeSrc : undefined,
+    ),
+    createRootFormatContext(options ? options.namespaceURI : undefined),
+    options ? options.progressiveChunkSize : undefined,
+    options ? options.onError : undefined,
+    options ? options.onAllReady : undefined,
+    options ? options.onShellReady : undefined,
+    options ? options.onShellError : undefined,
+    undefined, // onFatalError
+    undefined, // rootBoundaryID
+  );
+  let hasStartedFlowing = false;
+  startWork(request);
+  return {
+    pipe<T: Writable>(destination: T): T {
+      if (hasStartedFlowing) {
+        throw new Error(
+          'React currently only supports piping to one writable stream.',
+        );
+      }
+      hasStartedFlowing = true;
+      startFlowing(request, destination);
+      destination.on('drain', createDrainHandler(destination, request));
+      destination.on(
+        'error',
+        createAbortHandler(
+          request,
+          'The destination stream errored while writing data.',
+        ),
+      );
+      destination.on(
+        'close',
+        createAbortHandler(request, 'The destination stream closed early.'),
+      );
+      return destination;
+    },
+    abort(reason: mixed) {
+      abort(request, reason);
+    },
+  };
+}
+
+type IntoContainerOptions = {
+  identifierPrefix?: string,
+  namespaceURI?: string,
+  nonce?: string,
+  bootstrapScriptContent?: string,
+  bootstrapScripts?: Array<string | BootstrapScriptDescriptor>,
+  bootstrapModules?: Array<string | BootstrapScriptDescriptor>,
+  fallbackBootstrapScriptContent?: string,
+  fallbackBootstrapScripts?: Array<string | BootstrapScriptDescriptor>,
+  fallbackBootstrapModules?: Array<string | BootstrapScriptDescriptor>,
+  progressiveChunkSize?: number,
+  onAllReady?: () => void,
+  onError?: (error: mixed) => ?string,
+  unstable_externalRuntimeSrc?: string | BootstrapScriptDescriptor,
+};
+
+function renderIntoContainerAsPipeableStream(
+  children: ReactNodeList,
+  containerID: string,
+  options?: IntoContainerOptions,
+): PipeableStream {
+  const request = createRequest(
+    children,
+    createResponseState(
+      options ? options.identifierPrefix : undefined,
+      options ? options.nonce : undefined,
+      options ? options.bootstrapScriptContent : undefined,
+      options ? options.bootstrapScripts : undefined,
+      options ? options.bootstrapModules : undefined,
+      options ? options.fallbackBootstrapScriptContent : undefined,
+      options ? options.fallbackBootstrapScripts : undefined,
+      options ? options.fallbackBootstrapModules : undefined,
+      options ? options.unstable_externalRuntimeSrc : undefined,
+    ),
+    createRootFormatContext(options ? options.namespaceURI : undefined),
+    options ? options.progressiveChunkSize : undefined,
+    options ? options.onError : undefined,
+    options ? options.onAllReady : undefined,
+    undefined, // onShellReady
+    undefined, // onShellError
+    undefined, // onFatalError
+    createRootBoundaryID(containerID),
+  );
+  let hasStartedFlowing = false;
+  startWork(request);
+  return {
+    pipe<T: Writable>(destination: T): T {
+      if (hasStartedFlowing) {
+        throw new Error(
+          'React currently only supports piping to one writable stream.',
+        );
+      }
+      hasStartedFlowing = true;
+      startFlowing(request, destination);
+      destination.on('drain', createDrainHandler(destination, request));
+      destination.on(
+        'error',
+        createAbortHandler(
+          request,
+          'The destination stream errored while writing data.',
+        ),
+      );
+      destination.on(
+        'close',
+        createAbortHandler(request, 'The destination stream closed early.'),
+      );
+      return destination;
+    },
+    abort(reason: mixed) {
+      abort(request, reason);
+    },
+  };
+}
+
+export {
+  renderToPipeableStream,
+  renderIntoContainerAsPipeableStream,
+  ReactVersion as version,
+};
diff --git a/packages/react-dom/src/server/ReactDOMFizzStaticBrowser.js b/packages/react-dom/src/server/ReactDOMFizzStaticBrowser.js
index 7f88593dd50f8..e25ae8ee4249c 100644
--- a/packages/react-dom/src/server/ReactDOMFizzStaticBrowser.js
+++ b/packages/react-dom/src/server/ReactDOMFizzStaticBrowser.js
@@ -72,6 +72,9 @@ function prerender(
         options ? options.bootstrapScriptContent : undefined,
         options ? options.bootstrapScripts : undefined,
         options ? options.bootstrapModules : undefined,
+        undefined, // fallbackBootstrapScriptContent
+        undefined, // fallbackBootstrapScripts
+        undefined, // fallbackBootstrapModules
         options ? options.unstable_externalRuntimeSrc : undefined,
       ),
       createRootFormatContext(options ? options.namespaceURI : undefined),
@@ -81,6 +84,7 @@ function prerender(
       undefined,
       undefined,
       onFatalError,
+      undefined, // rootBoundaryID
     );
     if (options && options.signal) {
       const signal = options.signal;
diff --git a/packages/react-dom/src/server/ReactDOMFizzStaticNode.js b/packages/react-dom/src/server/ReactDOMFizzStaticNode.js
index eb0228fa6d52c..430a59768f30f 100644
--- a/packages/react-dom/src/server/ReactDOMFizzStaticNode.js
+++ b/packages/react-dom/src/server/ReactDOMFizzStaticNode.js
@@ -87,6 +87,9 @@ function prerenderToNodeStreams(
         options ? options.bootstrapScriptContent : undefined,
         options ? options.bootstrapScripts : undefined,
         options ? options.bootstrapModules : undefined,
+        undefined, // fallbackBootstrapScriptContent
+        undefined, // fallbackBootstrapScripts
+        undefined, // fallbackBootstrapModules
         options ? options.unstable_externalRuntimeSrc : undefined,
       ),
       createRootFormatContext(options ? options.namespaceURI : undefined),
@@ -96,6 +99,7 @@ function prerenderToNodeStreams(
       undefined,
       undefined,
       onFatalError,
+      undefined, // rootBoundaryID
     );
     if (options && options.signal) {
       const signal = options.signal;
diff --git a/packages/react-dom/src/server/ReactDOMLegacyServerImpl.js b/packages/react-dom/src/server/ReactDOMLegacyServerImpl.js
index 2d9fed4a556f1..d440e611de4a4 100644
--- a/packages/react-dom/src/server/ReactDOMLegacyServerImpl.js
+++ b/packages/react-dom/src/server/ReactDOMLegacyServerImpl.js
@@ -75,6 +75,7 @@ function renderToStringImpl(
     onShellReady,
     undefined,
     undefined,
+    undefined, // rootBoundaryID
   );
   startWork(request);
   // If anything suspended and is still pending, we'll abort it before writing.
diff --git a/packages/react-dom/src/server/ReactDOMLegacyServerNodeStream.js b/packages/react-dom/src/server/ReactDOMLegacyServerNodeStream.js
index 167d6cc1e1147..75613acb51cc1 100644
--- a/packages/react-dom/src/server/ReactDOMLegacyServerNodeStream.js
+++ b/packages/react-dom/src/server/ReactDOMLegacyServerNodeStream.js
@@ -80,6 +80,8 @@ function renderToNodeStreamImpl(
     onAllReady,
     undefined,
     undefined,
+    undefined, // rootBoundaryID
+    undefined, // rootBoundaryID
   );
   destination.request = request;
   startWork(request);
diff --git a/packages/react-dom/src/test-utils/FizzTestUtils.js b/packages/react-dom/src/test-utils/FizzTestUtils.js
index 1df5ca947e7c0..48585e7e85068 100644
--- a/packages/react-dom/src/test-utils/FizzTestUtils.js
+++ b/packages/react-dom/src/test-utils/FizzTestUtils.js
@@ -114,14 +114,28 @@ async function replaceScriptsAndMove(
     node.nodeType === 1 &&
     // $FlowFixMe[prop-missing]
     node.dataset != null &&
-    (node.dataset.rxi != null ||
-      node.dataset.rri != null ||
-      node.dataset.rci != null ||
-      node.dataset.rsi != null)
+    // client render instruction
+    (node.dataset.ix != null ||
+      // segement instruction
+      node.dataset.is != null ||
+      // boundary with styles instruction
+      node.dataset.ir != null ||
+      // boundary instruction
+      node.dataset.ib != null ||
+      // container with styles instruction
+      node.dataset.ik != null ||
+      // container instruction
+      node.dataset.ic != null)
   ) {
     // External runtime assumes that instruction data nodes are eventually
     // appended to the body
     window.document.body.appendChild(node);
+  } else if (node.nodeType === 1 && node.nodeName === 'TEMPLATE') {
+    // templates can now container scripts that a browser would not execute upon parsing
+    // we opt out of the recursive search for deeper scripts
+    if (parent != null) {
+      parent.appendChild(node);
+    }
   } else {
     for (let i = 0; i < node.childNodes.length; i++) {
       const inner = node.childNodes[i];
@@ -133,6 +147,86 @@ async function replaceScriptsAndMove(
   }
 }
 
+export function installScriptObserver(window: any, document: Document) {
+  let observer = window.__scriptObserver;
+  if (!observer) {
+    window.__observedScripts = new Set();
+    window.__loadScripts = loadScripts;
+    window.eval(scriptObserverFunctionString);
+    observer = window.__scriptObserver;
+  }
+  observer.observe(document, {childList: true});
+  if (document.documentElement) {
+    observer.observe(document.documentElement, {childList: true});
+  }
+  if (document.head) {
+    observer.observe(document.head, {childList: true});
+  }
+  if (document.body) {
+    observer.observe(document.body, {childList: true});
+  }
+}
+
+export function removeScriptObserver(window: any) {
+  if (window.__scriptObserver) {
+    window.__scriptObserver.disconnect();
+  }
+}
+
+const scriptObserverFunctionString = `
+  const scriptObserver = new MutationObserver(mutations => {
+    let promises = [];
+    for (var i = 0; i < mutations.length; i++) {
+      const addedNodes = mutations[i].addedNodes;
+      if (addedNodes.length) {
+        var pendingWork = window.__loadScripts(window);
+        window.__pendingWork = (window.__pendingWork || Promise.resolve()).then(() => pendingWork);
+        // We can stop here because loadScripts loads scripts globally so there
+        // is not additional benefit to calling it for each mutation that added nodes
+      }
+    }
+  });
+
+  window.__scriptObserver = scriptObserver;
+`;
+
+async function loadScripts(window: any) {
+  const scripts = window.document.querySelectorAll(':not(template) script');
+  for (let i = 0; i < scripts.length; i++) {
+    const script = scripts.item(i);
+    if (window.__observedScripts.has(script)) {
+      // noop
+    } else {
+      const scriptSrc = script.getAttribute('src');
+      if (scriptSrc) {
+        window.__observedScripts.add(script);
+        const rollupOutput = await getRollupResult(scriptSrc);
+        if (rollupOutput) {
+          // Manually call eval(...) here, since changing the HTML text content
+          //  may interfere with hydration
+          window.eval(rollupOutput);
+        }
+      } else {
+        const newScript = window.document.createElement('script');
+        window.__observedScripts.add(newScript);
+
+        newScript.textContent = script.textContent;
+        script.parentNode?.insertBefore(newScript, script);
+        script.parentNode?.removeChild(script);
+      }
+    }
+  }
+}
+
+export async function pendingWork(window: any): Promise<void> {
+  const originalPendingWork = window.__pendingWork;
+  await window.__pendingWork;
+  if (window.__pendingWork !== originalPendingWork) {
+    // Something new was added to the queue, await that too
+    return pendingWork(window);
+  }
+}
+
 function mergeOptions(options: Object, defaultOptions: Object): Object {
   return {
     ...defaultOptions,
diff --git a/packages/react-native-renderer/src/server/ReactNativeServerFormatConfig.js b/packages/react-native-renderer/src/server/ReactNativeServerFormatConfig.js
index 99b09631002fa..ec8562415d6d4 100644
--- a/packages/react-native-renderer/src/server/ReactNativeServerFormatConfig.js
+++ b/packages/react-native-renderer/src/server/ReactNativeServerFormatConfig.js
@@ -180,6 +180,13 @@ export function writeCompletedRoot(
   return true;
 }
 
+export function writeErroredRoot(
+  destination: Destination,
+  responseState: ResponseState,
+): boolean {
+  return true;
+}
+
 // IDs are formatted as little endian Uint16
 function formatID(id: number): Uint8Array {
   if (id > 0xffff) {
@@ -290,6 +297,18 @@ export function writeCompletedSegmentInstruction(
   return true;
 }
 
+export function writeCompletedRootBoundaryInstruction(
+  destination: Destination,
+  responseState: ResponseState,
+  boundaryID: SuspenseBoundaryID,
+  contentSegmentID: number,
+  resources: BoundaryResources,
+): boolean {
+  writeChunk(destination, SUSPENSE_UPDATE_TO_COMPLETE);
+  writeChunk(destination, formatID(boundaryID));
+  return writeChunkAndReturn(destination, formatID(contentSegmentID));
+}
+
 export function writeCompletedBoundaryInstruction(
   destination: Destination,
   responseState: ResponseState,
@@ -319,7 +338,7 @@ export function writeInitialResources(
   destination: Destination,
   resources: Resources,
   responseState: ResponseState,
-  willFlushAllSegments: boolean,
+  willEmitInstructions: boolean,
 ): boolean {
   return true;
 }
@@ -328,6 +347,7 @@ export function writeImmediateResources(
   destination: Destination,
   resources: Resources,
   responseState: ResponseState,
+  willEmitInstructions: boolean,
 ): boolean {
   return true;
 }
diff --git a/packages/react-noop-renderer/src/ReactNoopServer.js b/packages/react-noop-renderer/src/ReactNoopServer.js
index 55d63ccf9f266..153786cb9919a 100644
--- a/packages/react-noop-renderer/src/ReactNoopServer.js
+++ b/packages/react-noop-renderer/src/ReactNoopServer.js
@@ -97,6 +97,10 @@ const ReactNoopServer = ReactFizzServer({
     return {state: 'pending', children: []};
   },
 
+  getRootBoundaryID(): null {
+    return null;
+  },
+
   getChildFormatContext(): null {
     return null;
   },
diff --git a/packages/react-reconciler/src/ReactFiberBeginWork.js b/packages/react-reconciler/src/ReactFiberBeginWork.js
index 6a7c147ff3a17..d70bd24f48b17 100644
--- a/packages/react-reconciler/src/ReactFiberBeginWork.js
+++ b/packages/react-reconciler/src/ReactFiberBeginWork.js
@@ -1474,7 +1474,7 @@ function updateHostRoot(
   const nextChildren = nextState.element;
   if (supportsHydration && prevState.isDehydrated) {
     // This is a hydration root whose shell has not yet hydrated. We should
-    // attempt to hydrate.
+    // attempt to hydrate
 
     // Flip isDehydrated to false to indicate that when this render
     // finishes, the root will no longer be dehydrated.
diff --git a/packages/react-server-dom-relay/src/ReactDOMServerFB.js b/packages/react-server-dom-relay/src/ReactDOMServerFB.js
index 34f8862127ce0..b50a7e23afaec 100644
--- a/packages/react-server-dom-relay/src/ReactDOMServerFB.js
+++ b/packages/react-server-dom-relay/src/ReactDOMServerFB.js
@@ -57,6 +57,9 @@ function renderToStream(children: ReactNodeList, options: Options): Stream {
       options ? options.bootstrapScriptContent : undefined,
       options ? options.bootstrapScripts : undefined,
       options ? options.bootstrapModules : undefined,
+      undefined,
+      undefined,
+      undefined,
       options ? options.unstable_externalRuntimeSrc : undefined,
     ),
     createRootFormatContext(undefined),
@@ -64,6 +67,7 @@ function renderToStream(children: ReactNodeList, options: Options): Stream {
     options.onError,
     undefined,
     undefined,
+    undefined, // rootBoundaryID
   );
   startWork(request);
   if (destination.fatal) {
diff --git a/packages/react-server/src/ReactFizzServer.js b/packages/react-server/src/ReactFizzServer.js
index 281e8bf342a58..674cb813603bd 100644
--- a/packages/react-server/src/ReactFizzServer.js
+++ b/packages/react-server/src/ReactFizzServer.js
@@ -44,6 +44,7 @@ import {
 } from './ReactServerStreamConfig';
 import {
   writeCompletedRoot,
+  writeErroredRoot,
   writePlaceholder,
   writeStartCompletedSuspenseBoundary,
   writeStartPendingSuspenseBoundary,
@@ -54,6 +55,7 @@ import {
   writeStartSegment,
   writeEndSegment,
   writeClientRenderBoundaryInstruction,
+  writeCompletedRootBoundaryInstruction,
   writeCompletedBoundaryInstruction,
   writeCompletedSegmentInstruction,
   pushTextInstance,
@@ -133,6 +135,7 @@ import {
   enableSuspenseAvoidThisFallbackFizz,
   enableFloat,
   enableCache,
+  enableFizzIntoContainer,
 } from 'shared/ReactFeatureFlags';
 
 import assign from 'shared/assign';
@@ -218,6 +221,7 @@ export opaque type Request = {
   abortableTasks: Set<Task>,
   pingedTasks: Array<Task>, // High priority tasks that should be worked on first.
   // Queues to flush in order of priority
+  rootBoundary: null | SuspenseBoundary, // If the root should stream with Boundary semantics it will be encoded here instead of completedRootSegment
   clientRenderedBoundaries: Array<SuspenseBoundary>, // Errored or client rendered but not yet flushed.
   completedBoundaries: Array<SuspenseBoundary>, // Completed but not yet fully flushed boundaries to show.
   partialBoundaries: Array<SuspenseBoundary>, // Partially completed boundaries that can flush its segments early.
@@ -274,6 +278,7 @@ export function createRequest(
   onShellReady: void | (() => void),
   onShellError: void | ((error: mixed) => void),
   onFatalError: void | ((error: mixed) => void),
+  rootBoundaryID: void | SuspenseBoundaryID,
 ): Request {
   const pingedTasks = [];
   const abortSet: Set<Task> = new Set();
@@ -294,6 +299,7 @@ export function createRequest(
     completedRootSegment: null,
     abortableTasks: abortSet,
     pingedTasks: pingedTasks,
+    rootBoundary: (null: null | SuspenseBoundary),
     clientRenderedBoundaries: ([]: Array<SuspenseBoundary>),
     completedBoundaries: ([]: Array<SuspenseBoundary>),
     partialBoundaries: ([]: Array<SuspenseBoundary>),
@@ -305,7 +311,18 @@ export function createRequest(
     onShellError: onShellError === undefined ? noop : onShellError,
     onFatalError: onFatalError === undefined ? noop : onFatalError,
   };
-  // This segment represents the root fallback.
+
+  if (rootBoundaryID !== undefined) {
+    const fallbackAbortSet: Set<Task> = new Set();
+    const rootBoundary = (request.rootBoundary = createSuspenseBoundary(
+      request,
+      fallbackAbortSet,
+    ));
+    rootBoundary.parentFlushed = true;
+    rootBoundary.rootSegmentID = request.nextSegmentId++;
+    rootBoundary.id = rootBoundaryID;
+  }
+
   const rootSegment = createPendingSegment(
     request,
     0,
@@ -315,13 +332,14 @@ export function createRequest(
     false,
     false,
   );
+
   // There is no parent so conceptually, we're unblocked to flush this segment.
   rootSegment.parentFlushed = true;
   const rootTask = createTask(
     request,
     null,
     children,
-    null,
+    request.rootBoundary || null,
     rootSegment,
     abortSet,
     emptyContextObject,
@@ -1652,7 +1670,7 @@ function erroredTask(
 
       // Regardless of what happens next, this boundary won't be displayed,
       // so we can flush it, if the parent already flushed.
-      if (boundary.parentFlushed) {
+      if (boundary.parentFlushed && boundary !== request.rootBoundary) {
         // We don't have a preference where in the queue this goes since it's likely
         // to error on the client anyway. However, intentionally client-rendered
         // boundaries should be flushed earlier so that they can start on the client.
@@ -1801,7 +1819,7 @@ function finishedTask(
       if (enableFloat) {
         hoistCompletedBoundaryResources(request, boundary);
       }
-      if (boundary.parentFlushed) {
+      if (boundary.parentFlushed && boundary !== request.rootBoundary) {
         // The segment might be part of a segment that didn't flush yet, but if the boundary's
         // parent flushed, we need to schedule the boundary to be emitted.
         request.completedBoundaries.push(boundary);
@@ -2127,24 +2145,27 @@ function flushInitialResources(
   destination: Destination,
   resources: Resources,
   responseState: ResponseState,
-  willFlushAllSegments: boolean,
+  willEmitInstructions: boolean,
 ): void {
   writeInitialResources(
     destination,
     resources,
     responseState,
-    willFlushAllSegments,
+    willEmitInstructions,
   );
 }
 
 function flushImmediateResources(
   destination: Destination,
-  request: Request,
+  resources: Resources,
+  responseState: ResponseState,
+  willEmitInstructions: boolean,
 ): void {
   writeImmediateResources(
     destination,
-    request.resources,
-    request.responseState,
+    resources,
+    responseState,
+    willEmitInstructions,
   );
 }
 
@@ -2178,6 +2199,34 @@ function flushSegmentContainer(
   return writeEndSegment(destination, segment.formatContext);
 }
 
+function flushCompletedRootBoundary(
+  request: Request,
+  destination: Destination,
+  boundary: SuspenseBoundary,
+): boolean {
+  if (enableFloat) {
+    setCurrentlyRenderingBoundaryResourcesTarget(
+      request.resources,
+      boundary.resources,
+    );
+  }
+  const completedSegments = boundary.completedSegments;
+  let i = 0;
+  for (; i < completedSegments.length; i++) {
+    const segment = completedSegments[i];
+    flushPartiallyCompletedSegment(request, destination, boundary, segment);
+  }
+  completedSegments.length = 0;
+
+  return writeCompletedRootBoundaryInstruction(
+    destination,
+    request.responseState,
+    boundary.id,
+    boundary.rootSegmentID,
+    boundary.resources,
+  );
+}
+
 function flushCompletedBoundary(
   request: Request,
   destination: Destination,
@@ -2291,11 +2340,12 @@ function flushCompletedQueues(
             writeChunk(destination, preamble[i]);
           }
 
+          const willEmitInstructions = request.allPendingTasks > 0;
           flushInitialResources(
             destination,
             request.resources,
             request.responseState,
-            request.allPendingTasks === 0,
+            willEmitInstructions,
           );
         }
 
@@ -2306,8 +2356,38 @@ function flushCompletedQueues(
         // We haven't flushed the root yet so we don't need to check any other branches further down
         return;
       }
-    } else if (enableFloat) {
-      flushImmediateResources(destination, request);
+    } else if (request.pendingRootTasks > 0) {
+      // There are still root tasks and we have no completedRootSegment. We infer that a root segment
+      // will eventually arrive and avoid flushing anything deeper. We do this to avoid emitting
+      // resources or boundaries before we have flushed the completedRootSegment
+      return;
+    }
+
+    if (enableFloat) {
+      const willFlushInstructions =
+        request.rootBoundary !== null ||
+        request.clientRenderedBoundaries.length > 0 ||
+        request.partialBoundaries.length > 0 ||
+        request.completedBoundaries.length > 0;
+      flushImmediateResources(
+        destination,
+        request.resources,
+        request.responseState,
+        willFlushInstructions,
+      );
+    }
+
+    if (enableFizzIntoContainer) {
+      if (request.rootBoundary !== null) {
+        const rootBoundary = request.rootBoundary;
+        if (rootBoundary.forceClientRender) {
+          request.rootBoundary = null;
+          writeErroredRoot(destination, request.responseState);
+        } else if (rootBoundary.pendingTasks === 0) {
+          request.rootBoundary = null;
+          flushCompletedRootBoundary(request, destination, rootBoundary);
+        }
+      }
     }
 
     // We emit client rendering instructions for already emitted boundaries first.
diff --git a/packages/react-server/src/forks/ReactServerFormatConfig.custom.js b/packages/react-server/src/forks/ReactServerFormatConfig.custom.js
index 26455b9ee493c..8199d9321d047 100644
--- a/packages/react-server/src/forks/ReactServerFormatConfig.custom.js
+++ b/packages/react-server/src/forks/ReactServerFormatConfig.custom.js
@@ -47,6 +47,7 @@ export const pushEndCompletedSuspenseBoundary =
   $$$hostConfig.pushEndCompletedSuspenseBoundary;
 export const pushSegmentFinale = $$$hostConfig.pushSegmentFinale;
 export const writeCompletedRoot = $$$hostConfig.writeCompletedRoot;
+export const writeErroredRoot = $$$hostConfig.writeErroredRoot;
 export const writePlaceholder = $$$hostConfig.writePlaceholder;
 export const writeStartCompletedSuspenseBoundary =
   $$$hostConfig.writeStartCompletedSuspenseBoundary;
@@ -64,6 +65,8 @@ export const writeStartSegment = $$$hostConfig.writeStartSegment;
 export const writeEndSegment = $$$hostConfig.writeEndSegment;
 export const writeCompletedSegmentInstruction =
   $$$hostConfig.writeCompletedSegmentInstruction;
+export const writeCompletedRootBoundaryInstruction =
+  $$$hostConfig.writeCompletedRootBoundaryInstruction;
 export const writeCompletedBoundaryInstruction =
   $$$hostConfig.writeCompletedBoundaryInstruction;
 export const writeClientRenderBoundaryInstruction =
diff --git a/packages/shared/ReactFeatureFlags.js b/packages/shared/ReactFeatureFlags.js
index 18f38d3aa81e7..3cc5780e5b478 100644
--- a/packages/shared/ReactFeatureFlags.js
+++ b/packages/shared/ReactFeatureFlags.js
@@ -127,6 +127,8 @@ export const enableUseEffectEventHook = __EXPERIMENTAL__;
 // (handled with an MutationObserver) instead of inline-scripts
 export const enableFizzExternalRuntime = false;
 
+export const enableFizzIntoContainer = __EXPERIMENTAL__;
+
 // -----------------------------------------------------------------------------
 // Chopping Block
 //
diff --git a/packages/shared/forks/ReactFeatureFlags.native-fb.js b/packages/shared/forks/ReactFeatureFlags.native-fb.js
index 056672c914057..7950cd6948957 100644
--- a/packages/shared/forks/ReactFeatureFlags.native-fb.js
+++ b/packages/shared/forks/ReactFeatureFlags.native-fb.js
@@ -86,5 +86,7 @@ export const enableHostSingletons = true;
 export const useModernStrictMode = false;
 export const enableFizzExternalRuntime = false;
 
+export const enableFizzIntoContainer = true;
+
 // Flow magic to verify the exports of this file match the original version.
 ((((null: any): ExportsType): FeatureFlagsType): ExportsType);
diff --git a/packages/shared/forks/ReactFeatureFlags.native-oss.js b/packages/shared/forks/ReactFeatureFlags.native-oss.js
index 97723bdc9d765..57712c2dc14cb 100644
--- a/packages/shared/forks/ReactFeatureFlags.native-oss.js
+++ b/packages/shared/forks/ReactFeatureFlags.native-oss.js
@@ -76,5 +76,7 @@ export const enableHostSingletons = true;
 export const useModernStrictMode = false;
 export const enableFizzExternalRuntime = false;
 
+export const enableFizzIntoContainer = true;
+
 // Flow magic to verify the exports of this file match the original version.
 ((((null: any): ExportsType): FeatureFlagsType): ExportsType);
diff --git a/packages/shared/forks/ReactFeatureFlags.test-renderer.js b/packages/shared/forks/ReactFeatureFlags.test-renderer.js
index 8941aa4b39d60..907d46a715990 100644
--- a/packages/shared/forks/ReactFeatureFlags.test-renderer.js
+++ b/packages/shared/forks/ReactFeatureFlags.test-renderer.js
@@ -76,5 +76,7 @@ export const enableHostSingletons = true;
 export const useModernStrictMode = false;
 export const enableFizzExternalRuntime = false;
 
+export const enableFizzIntoContainer = true;
+
 // Flow magic to verify the exports of this file match the original version.
 ((((null: any): ExportsType): FeatureFlagsType): ExportsType);
diff --git a/packages/shared/forks/ReactFeatureFlags.test-renderer.native.js b/packages/shared/forks/ReactFeatureFlags.test-renderer.native.js
index faa6aa3ebf760..db1528e90a856 100644
--- a/packages/shared/forks/ReactFeatureFlags.test-renderer.native.js
+++ b/packages/shared/forks/ReactFeatureFlags.test-renderer.native.js
@@ -73,5 +73,7 @@ export const enableHostSingletons = true;
 
 export const useModernStrictMode = false;
 
+export const enableFizzIntoContainer = true;
+
 // Flow magic to verify the exports of this file match the original version.
 ((((null: any): ExportsType): FeatureFlagsType): ExportsType);
diff --git a/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js b/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js
index 9d97f6cba6a06..64aaf3d9de838 100644
--- a/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js
+++ b/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js
@@ -78,5 +78,7 @@ export const enableHostSingletons = true;
 export const useModernStrictMode = false;
 export const enableFizzExternalRuntime = false;
 
+export const enableFizzIntoContainer = true;
+
 // Flow magic to verify the exports of this file match the original version.
 ((((null: any): ExportsType): FeatureFlagsType): ExportsType);
diff --git a/packages/shared/forks/ReactFeatureFlags.testing.js b/packages/shared/forks/ReactFeatureFlags.testing.js
index bf00a167693ce..6b1da74669b1d 100644
--- a/packages/shared/forks/ReactFeatureFlags.testing.js
+++ b/packages/shared/forks/ReactFeatureFlags.testing.js
@@ -76,5 +76,7 @@ export const enableHostSingletons = true;
 export const useModernStrictMode = false;
 export const enableFizzExternalRuntime = false;
 
+export const enableFizzIntoContainer = true;
+
 // Flow magic to verify the exports of this file match the original version.
 ((((null: any): ExportsType): FeatureFlagsType): ExportsType);
diff --git a/packages/shared/forks/ReactFeatureFlags.testing.www.js b/packages/shared/forks/ReactFeatureFlags.testing.www.js
index 727d2b0770825..322c2b3b3d967 100644
--- a/packages/shared/forks/ReactFeatureFlags.testing.www.js
+++ b/packages/shared/forks/ReactFeatureFlags.testing.www.js
@@ -77,5 +77,7 @@ export const enableHostSingletons = true;
 export const useModernStrictMode = false;
 export const enableFizzExternalRuntime = false;
 
+export const enableFizzIntoContainer = true;
+
 // Flow magic to verify the exports of this file match the original version.
 ((((null: any): ExportsType): FeatureFlagsType): ExportsType);
diff --git a/packages/shared/forks/ReactFeatureFlags.www.js b/packages/shared/forks/ReactFeatureFlags.www.js
index 04261829f25e8..3197144bb18a3 100644
--- a/packages/shared/forks/ReactFeatureFlags.www.js
+++ b/packages/shared/forks/ReactFeatureFlags.www.js
@@ -108,5 +108,7 @@ export const enableCustomElementPropertySupport = __EXPERIMENTAL__;
 export const useModernStrictMode = false;
 export const enableFizzExternalRuntime = true;
 
+export const enableFizzIntoContainer = true;
+
 // Flow magic to verify the exports of this file match the original version.
 ((((null: any): ExportsType): FeatureFlagsType): ExportsType);
diff --git a/scripts/error-codes/codes.json b/scripts/error-codes/codes.json
index 52fa873e633c2..6934cd8a97b90 100644
--- a/scripts/error-codes/codes.json
+++ b/scripts/error-codes/codes.json
@@ -450,5 +450,7 @@
   "462": "Unexpected SuspendedReason. This is a bug in React.",
   "463": "ReactDOMServer.renderToNodeStream(): The Node Stream API is not available in Bun. Use ReactDOMServer.renderToReadableStream() instead.",
   "464": "ReactDOMServer.renderToStaticNodeStream(): The Node Stream API is not available in Bun. Use ReactDOMServer.renderToReadableStream() instead.",
-  "465": "enableFizzExternalRuntime without enableFloat is not supported. This should never appear in production, since it means you are using a misconfigured React bundle."
+  "465": "enableFizzExternalRuntime without enableFloat is not supported. This should never appear in production, since it means you are using a misconfigured React bundle.",
+  "466": "The root container experienced an error before hydration could begin. The root will switch to client rendering.\n  Container Error: \"%s\"",
+  "467": "React encountered a render instruction it did not recognize."
 }
diff --git a/scripts/rollup/generate-inline-fizz-runtime.js b/scripts/rollup/generate-inline-fizz-runtime.js
index 226c844561be8..5c85e7c33ae8e 100644
--- a/scripts/rollup/generate-inline-fizz-runtime.js
+++ b/scripts/rollup/generate-inline-fizz-runtime.js
@@ -29,6 +29,10 @@ const config = [
     entry: 'ReactDOMFizzInlineCompleteSegment.js',
     exportName: 'completeSegment',
   },
+  {
+    entry: 'ReactDOMFizzInlineCompleteContainer.js',
+    exportName: 'completeContainer',
+  },
 ];
 
 const prettierConfig = require('../../.prettierrc.js');
diff --git a/scripts/shared/inlinedHostConfigs.js b/scripts/shared/inlinedHostConfigs.js
index ec03dd1647c3f..6e21c7c9e5be7 100644
--- a/scripts/shared/inlinedHostConfigs.js
+++ b/scripts/shared/inlinedHostConfigs.js
@@ -13,6 +13,8 @@ module.exports = [
       'react-dom',
       'react-dom/unstable_testing',
       'react-dom/src/server/ReactDOMFizzServerNode.js',
+      'react-dom/src/server/ReactDOMFizzServerNode.fb.js',
+      'react-dom/src/server/ReactDOMFizzServerNode.stable.js',
       'react-dom/static.node',
       'react-dom/server-rendering-stub',
       'react-dom/unstable_server-external-runtime',
@@ -28,6 +30,9 @@ module.exports = [
       'react-dom/static',
       'react-dom/static.node',
       'react-dom/src/server/ReactDOMFizzServerNode.js', // react-dom/server.node
+      'react-dom/src/server/ReactDOMFizzServerNode.fb.js', // react-dom/server.node
+      'react-dom/src/server/ReactDOMFizzServerNode.stable.js', // react-dom/server.node
+      'react-dom/src/server/ReactDOMFizzServerNodeImpl.js',
       'react-dom/src/server/ReactDOMFizzStaticNode.js',
       'react-server-dom-webpack',
       'react-server-dom-webpack/client',
@@ -47,12 +52,20 @@ module.exports = [
   },
   {
     shortName: 'bun',
-    entryPoints: ['react-dom', 'react-dom/src/server/ReactDOMFizzServerBun.js'],
+    entryPoints: [
+      'react-dom',
+      'react-dom/src/server/ReactDOMFizzServerBun.js',
+      'react-dom/src/server/ReactDOMFizzServerBun.fb.js',
+      'react-dom/src/server/ReactDOMFizzServerBun.stable.js',
+    ],
     paths: [
       'react-dom',
       'react-dom/server',
       'react-dom/server.bun',
       'react-dom/src/server/ReactDOMFizzServerBun.js',
+      'react-dom/src/server/ReactDOMFizzServerBun.fb.js',
+      'react-dom/src/server/ReactDOMFizzServerBun.stable.js',
+      'react-dom/src/server/ReactDOMFizzServerBunImpl.js',
       'react-dom-bindings',
       'react-dom/server.node',
       'react-server-dom-webpack',
@@ -70,6 +83,8 @@ module.exports = [
       'react-dom',
       'react-dom/unstable_testing',
       'react-dom/src/server/ReactDOMFizzServerBrowser.js',
+      'react-dom/src/server/ReactDOMFizzServerBrowser.fb.js',
+      'react-dom/src/server/ReactDOMFizzServerBrowser.stable.js',
       'react-dom/static.browser',
       'react-dom/server-rendering-stub',
       'react-dom/unstable_server-external-runtime',
@@ -84,6 +99,9 @@ module.exports = [
       'react-dom/static.browser',
       'react-dom/unstable_testing',
       'react-dom/src/server/ReactDOMFizzServerBrowser.js', // react-dom/server.browser
+      'react-dom/src/server/ReactDOMFizzServerBrowser.fb.js', // react-dom/server.browser
+      'react-dom/src/server/ReactDOMFizzServerBrowser.stable.js', // react-dom/server.browser
+      'react-dom/src/server/ReactDOMFizzServerBrowserImpl.js',
       'react-dom/src/server/ReactDOMFizzStaticBrowser.js',
       'react-server-dom-webpack',
       'react-server-dom-webpack/client',