Emit a separate comment instead of extending component comment

Author: maraf

src/Components/Endpoints/src/DependencyInjection/WebAssemblyEnvironmentEmitter.cs

@@ -9,14 +9,16 @@ internal class WebAssemblyEnvironmentEmitter(IHostEnvironment hostEnvironment)
 {
     private bool wasEmittedAlready;
 
-    public string? GetEnvironmentOnce()
+    public bool TryGetEnvironmentOnce(out string environment)
     {
         if (wasEmittedAlready)
         {
-            return null;
+            environment = string.Empty;
+            return false;
         }
 
         wasEmittedAlready = true;
-        return hostEnvironment.EnvironmentName;
+        environment = hostEnvironment.EnvironmentName;
+        return true;
     }
 }

src/Components/Endpoints/src/Rendering/EndpointHtmlRenderer.Streaming.cs

@@ -271,6 +271,14 @@ private void WriteComponentHtml(int componentId, TextWriter output, bool allowBo
                 _httpContext.Response.Headers.CacheControl = "no-cache, no-store, max-age=0";
             }
 
+            if (marker.Type is ComponentMarker.WebAssemblyMarkerType or ComponentMarker.AutoMarkerType)
+            {
+                if (_httpContext.RequestServices.GetRequiredService<WebAssemblyEnvironmentEmitter>().TryGetEnvironmentOnce(out var environment))
+                {
+                    output.Write($"<!--Blazor-WebAssemblyEnvironment:{environment}-->");
+                }
+            }
+
             var serializedStartRecord = JsonSerializer.Serialize(marker, ServerComponentSerializationSettings.JsonSerializationOptions);
             output.Write("<!--Blazor:");
             output.Write(serializedStartRecord);

src/Components/Endpoints/src/Rendering/SSRRenderModeBoundary.cs

@@ -165,8 +165,8 @@ public ComponentMarker ToMarker(HttpContext httpContext, int sequence, object? c
         var marker = RenderMode switch
         {
             InteractiveServerRenderMode server => ComponentMarker.Create(ComponentMarker.ServerMarkerType, server.Prerender, _markerKey),
-            InteractiveWebAssemblyRenderMode webAssembly => ComponentMarker.Create(ComponentMarker.WebAssemblyMarkerType, webAssembly.Prerender, _markerKey, GetEnvironmentOnce(httpContext)),
-            InteractiveAutoRenderMode auto => ComponentMarker.Create(ComponentMarker.AutoMarkerType, auto.Prerender, _markerKey, GetEnvironmentOnce(httpContext)),
+            InteractiveWebAssemblyRenderMode webAssembly => ComponentMarker.Create(ComponentMarker.WebAssemblyMarkerType, webAssembly.Prerender, _markerKey),
+            InteractiveAutoRenderMode auto => ComponentMarker.Create(ComponentMarker.AutoMarkerType, auto.Prerender, _markerKey),
             _ => throw new UnreachableException($"Unknown render mode {RenderMode.GetType().FullName}"),
         };
 
@@ -188,9 +188,6 @@ public ComponentMarker ToMarker(HttpContext httpContext, int sequence, object? c
         return marker;
     }
 
-    private static string? GetEnvironmentOnce(HttpContext httpContext)
-        => httpContext.RequestServices.GetRequiredService<WebAssemblyEnvironmentEmitter>().GetEnvironmentOnce();
-
     private ComponentMarkerKey GenerateMarkerKey(int sequence, object? componentKey)
     {
         var componentTypeNameHash = _componentTypeNameHashCache.GetOrAdd(_componentType, TypeNameHash.Compute);

src/Components/Web.JS/src/Boot.WebAssembly.Common.ts

@@ -68,7 +68,7 @@ export function setWebAssemblyOptions(initializersReady: Promise<Partial<WebAsse
   }
 }
 
-export function startWebAssembly(components: RootComponentManager<WebAssemblyComponentDescriptor>, environment: string | undefined): Promise<void> {
+export function startWebAssembly(components: RootComponentManager<WebAssemblyComponentDescriptor>, environment: string | null | undefined): Promise<void> {
   if (startPromise !== undefined) {
     throw new Error('Blazor WebAssembly has already started.');
   }
@@ -78,7 +78,7 @@ export function startWebAssembly(components: RootComponentManager<WebAssemblyCom
   return startPromise;
 }
 
-async function startCore(components: RootComponentManager<WebAssemblyComponentDescriptor>, environment: string | undefined, resolve, _) {
+async function startCore(components: RootComponentManager<WebAssemblyComponentDescriptor>, environment: string | null | undefined, resolve, _) {
   if (inAuthRedirectIframe()) {
     // eslint-disable-next-line @typescript-eslint/no-empty-function
     await new Promise(() => { }); // See inAuthRedirectIframe for explanation
@@ -206,12 +206,12 @@ export function waitForBootConfigLoaded(): Promise<MonoConfig> {
   return bootConfigPromise;
 }
 
-export function loadWebAssemblyPlatformIfNotStarted(environment: string | undefined): Promise<void> {
+export function loadWebAssemblyPlatformIfNotStarted(environment: string | null | undefined): Promise<void> {
   platformLoadPromise ??= (async () => {
     await initializersPromise;
     const finalOptions = options ?? {};
     if (!finalOptions.environment) {
-      finalOptions.environment = environment;
+      finalOptions.environment = environment ?? undefined;
     }
     const existingConfig = options?.configureRuntime;
     finalOptions.configureRuntime = (config) => {

src/Components/Web.JS/src/Boot.WebAssembly.ts

@@ -6,7 +6,7 @@ import { Blazor } from './GlobalExports';
 import { shouldAutoStart } from './BootCommon';
 import { WebAssemblyStartOptions } from './Platform/WebAssemblyStartOptions';
 import { setWebAssemblyOptions, startWebAssembly } from './Boot.WebAssembly.Common';
-import { WebAssemblyComponentDescriptor, discoverComponents, findWebAssemblyEnvironment } from './Services/ComponentDescriptorDiscovery';
+import { WebAssemblyComponentDescriptor, discoverComponents, discoverWebAssemblyEnvironment } from './Services/ComponentDescriptorDiscovery';
 import { DotNet } from '@microsoft/dotnet-js-interop';
 import { InitialRootComponentsList } from './Services/InitialRootComponentsList';
 import { JSEventRegistry } from './Services/JSEventRegistry';
@@ -24,9 +24,10 @@ async function boot(options?: Partial<WebAssemblyStartOptions>): Promise<void> {
 
   JSEventRegistry.create(Blazor);
   const webAssemblyComponents = discoverComponents(document, 'webassembly') as WebAssemblyComponentDescriptor[];
+  const webAssemblyEnvironment = discoverWebAssemblyEnvironment(document);
 
   const components = new InitialRootComponentsList(webAssemblyComponents);
-  await startWebAssembly(components, findWebAssemblyEnvironment(webAssemblyComponents));
+  await startWebAssembly(components, webAssemblyEnvironment);
 }
 
 Blazor.start = boot;

src/Components/Web.JS/src/Rendering/DomMerging/DomSync.ts

@@ -1,7 +1,7 @@
 // Licensed to the .NET Foundation under one or more agreements.
 // The .NET Foundation licenses this file to you under the MIT license.
 
-import { AutoComponentDescriptor, ComponentDescriptor, ServerComponentDescriptor, WebAssemblyComponentDescriptor, canMergeDescriptors, discoverComponents, findWebAssemblyEnvironment, mergeDescriptors } from '../../Services/ComponentDescriptorDiscovery';
+import { AutoComponentDescriptor, ComponentDescriptor, ServerComponentDescriptor, WebAssemblyComponentDescriptor, canMergeDescriptors, discoverComponents, discoverWebAssemblyEnvironment, mergeDescriptors } from '../../Services/ComponentDescriptorDiscovery';
 import { isInteractiveRootComponentElement } from '../BrowserRenderer';
 import { applyAnyDeferredValue } from '../DomSpecialPropertyUtil';
 import { LogicalElement, getLogicalChildrenArray, getLogicalNextSibling, getLogicalParent, getLogicalRootDescriptor, insertLogicalChild, insertLogicalChildBefore, isLogicalElement, toLogicalElement, toLogicalRootCommentElement } from '../LogicalElements';
@@ -13,7 +13,7 @@ let descriptorHandler: DescriptorHandler | null = null;
 
 export interface DescriptorHandler {
   registerComponent(descriptor: ComponentDescriptor): void;
-  setWebAssemblyEnvironment(webAssemblyEnvironment: string | undefined): void;
+  setWebAssemblyEnvironment(webAssemblyEnvironment: string | null | undefined): void;
 }
 
 export function attachComponentDescriptorHandler(handler: DescriptorHandler) {
@@ -22,7 +22,7 @@ export function attachComponentDescriptorHandler(handler: DescriptorHandler) {
 
 export function registerAllComponentDescriptors(root: Node) {
   const descriptors = upgradeComponentCommentsToLogicalRootComments(root);
-  const webAssemblyEnvironment = findWebAssemblyEnvironment(descriptors);
+  const webAssemblyEnvironment = discoverWebAssemblyEnvironment(root);
   descriptorHandler?.setWebAssemblyEnvironment(webAssemblyEnvironment);
 
   for (const descriptor of descriptors) {
@@ -171,7 +171,7 @@ function treatAsMatch(destination: Node, source: Node) {
       }
 
       if (destinationRootDescriptor) {
-        // Update the existing descriptor with hte new descriptor's data
+        // Update the existing descriptor with the new descriptor's data
         mergeDescriptors(destinationRootDescriptor, sourceRootDescriptor);
 
         const isDestinationInteractive = isInteractiveRootComponentElement(destinationAsLogicalElement);

src/Components/Web.JS/src/Services/ComponentDescriptorDiscovery.ts

@@ -15,17 +15,10 @@ export function discoverComponents(root: Node, type: 'webassembly' | 'server' |
 const blazorServerStateCommentRegularExpression = /^\s*Blazor-Server-Component-State:(?<state>[a-zA-Z0-9+/=]+)$/;
 const blazorWebAssemblyStateCommentRegularExpression = /^\s*Blazor-WebAssembly-Component-State:(?<state>[a-zA-Z0-9+/=]+)$/;
 const blazorWebInitializerCommentRegularExpression = /^\s*Blazor-Web-Initializers:(?<initializers>[a-zA-Z0-9+/=]+)$/;
+const blazorWebAssemblyEnvironmentCommentRegularExpression = /^\s*Blazor-WebAssemblyEnvironment:(?<environment>[a-zA-Z0-9+/=]+)$/;
 
-export function findWebAssemblyEnvironment(components: ComponentDescriptor[]): string | undefined {
-  for (let index = 0; index < components.length; index++) {
-    const component = components[index];
-    const webAssemblyComponent = component as WebAssemblyComponentDescriptor;
-    if (webAssemblyComponent.environment) {
-      return webAssemblyComponent.environment;
-    }
-  }
-
-  return undefined;
+export function discoverWebAssemblyEnvironment(root: Node): string | null | undefined {
+  return discoverBlazorComment(root, blazorWebAssemblyEnvironmentCommentRegularExpression, 'environment');
 }
 
 export function discoverServerPersistedState(node: Node): string | null | undefined {
@@ -394,5 +387,4 @@ type WebAssemblyMarkerData = {
   assembly: string;
   parameterDefinitions: string;
   parameterValues: string;
-  environment: string | undefined;
 } & CommonMarkerData;

src/Components/Web.JS/src/Services/WebRootComponentManager.ts

@@ -111,12 +111,12 @@ export class WebRootComponentManager implements DescriptorHandler, RootComponent
     // may take a long time to load, so starting to load them now potentially reduces
     // the time to interactvity.
     if (descriptor.type === 'webassembly') {
-      this.startLoadingWebAssemblyIfNotStarted(descriptor.environment);
+      this.startLoadingWebAssemblyIfNotStarted();
     } else if (descriptor.type === 'auto') {
       // If the WebAssembly runtime starts downloading because an Auto component was added to
       // the page, we limit the maximum number of parallel WebAssembly resource downloads to 1
       // so that the performance of any Blazor Server circuit is minimally impacted.
-      this.startLoadingWebAssemblyIfNotStarted(descriptor.environment, /* maxParallelDownloadsOverride */ 1);
+      this.startLoadingWebAssemblyIfNotStarted(/* maxParallelDownloadsOverride */ 1);
     }
 
     const ssrComponentId = this._nextSsrComponentId++;
@@ -131,14 +131,14 @@ export class WebRootComponentManager implements DescriptorHandler, RootComponent
     this.circuitMayHaveNoRootComponents();
   }
 
-  private async startLoadingWebAssemblyIfNotStarted(environment: string | undefined, maxParallelDownloadsOverride?: number) {
+  private async startLoadingWebAssemblyIfNotStarted(maxParallelDownloadsOverride?: number) {
     if (hasStartedLoadingWebAssemblyPlatform()) {
       return;
     }
 
     setWaitForRootComponents();
 
-    const loadWebAssemblyPromise = loadWebAssemblyPlatformIfNotStarted(environment ?? this._webAssemblyEnvironment);
+    const loadWebAssemblyPromise = loadWebAssemblyPlatformIfNotStarted(this._webAssemblyEnvironment);
     const bootConfig = await waitForBootConfigLoaded();
 
     if (maxParallelDownloadsOverride !== undefined) {

src/Shared/Components/ComponentMarker.cs

@@ -57,19 +57,15 @@ internal struct ComponentMarker
     // Serialized values of the component's parameters.
     public string? ParameterValues { get; set; }
 
-    // The WebHost Environment
-    public string? Environment { get; set; }
-
     #endregion
 
-    public static ComponentMarker Create(string type, bool prerendered, ComponentMarkerKey? key, string? environment = null)
+    public static ComponentMarker Create(string type, bool prerendered, ComponentMarkerKey? key)
     {
         return new()
         {
             Type = type,
             PrerenderId = prerendered ? GeneratePrerenderId() : null,
             Key = key,
-            Environment = environment
         };
     }