feat(core): introduce BootstrapContext for improved server bootstrapping (#63562)

This commit introduces a number of changes to the server bootstrapping process to make it more robust and less error-prone, especially for concurrent requests.

Previously, the server rendering process relied on a module-level global platform injector. This could lead to issues in server-side rendering environments where multiple requests are processed concurrently, as they could inadvertently share or overwrite the global injector state.

The new approach introduces a `BootstrapContext` that is passed to the `bootstrapApplication` function. This context provides a platform reference that is scoped to the individual request, ensuring that each server-side render has an isolated platform injector. This prevents state leakage between concurrent requests and makes the overall process more reliable.

BREAKING CHANGE:
The server-side bootstrapping process has been changed to eliminate the reliance on a global platform injector.

Before:
```ts
const bootstrap = () => bootstrapApplication(AppComponent, config);
```

After:
```ts
const bootstrap = (context: BootstrapContext) =>
  bootstrapApplication(AppComponent, config, context);
```

A schematic is provided to automatically update `main.server.ts` files to pass the `BootstrapContext` to the `bootstrapApplication` call.

In addition, `getPlatform()` and `destroyPlatform()` will now return `null` and be a no-op respectively when running in a server environment.

PR Close #63562

Author: alan-agius4

adev/src/main.server.ts

@@ -6,10 +6,11 @@
  * found in the LICENSE file at https://angular.dev/license
  */
 
-import {bootstrapApplication} from '@angular/platform-browser';
+import {bootstrapApplication, BootstrapContext} from '@angular/platform-browser';
 import {AppComponent} from './app/app.component';
 import {config} from './app/app.config.server';
 
-const bootstrap = () => bootstrapApplication(AppComponent, config);
+const bootstrap = (context: BootstrapContext) =>
+  bootstrapApplication(AppComponent, config, context);
 
 export default bootstrap;

goldens/public-api/platform-browser/index.api.md

@@ -26,7 +26,12 @@ import { Type } from '@angular/core';
 import { Version } from '@angular/core';
 
 // @public
-export function bootstrapApplication(rootComponent: Type<unknown>, options?: ApplicationConfig): Promise<ApplicationRef>;
+export function bootstrapApplication(rootComponent: Type<unknown>, options?: ApplicationConfig, context?: BootstrapContext): Promise<ApplicationRef>;
+
+// @public
+export interface BootstrapContext {
+    platformRef: PlatformRef;
+}
 
 // @public
 export class BrowserModule {

goldens/public-api/platform-server/index.api.md

@@ -5,6 +5,7 @@
 ```ts
 
 import { ApplicationRef } from '@angular/core';
+import { BootstrapContext } from '@angular/platform-browser';
 import { EnvironmentProviders } from '@angular/core';
 import * as i0 from '@angular/core';
 import * as i1 from '@angular/platform-browser';
@@ -27,7 +28,7 @@ export interface PlatformConfig {
     url?: string;
 }
 
-// @public (undocumented)
+// @public
 export function platformServer(extraProviders?: StaticProvider[] | undefined): PlatformRef;
 
 // @public
@@ -45,7 +46,7 @@ export class PlatformState {
 export function provideServerRendering(): EnvironmentProviders;
 
 // @public
-export function renderApplication<T>(bootstrap: () => Promise<ApplicationRef>, options: {
+export function renderApplication(bootstrap: (context: BootstrapContext) => Promise<ApplicationRef>, options: {
     document?: string | Document;
     url?: string;
     platformProviders?: Provider[];

integration/platform-server-hydration/src/main.server.ts

@@ -1,7 +1,8 @@
-import {bootstrapApplication} from '@angular/platform-browser';
+import {bootstrapApplication, BootstrapContext} from '@angular/platform-browser';
 import {AppComponent} from './app/app.component';
 import {config} from './app/app.config.server';
 
-const bootstrap = () => bootstrapApplication(AppComponent, config);
+const bootstrap = (context: BootstrapContext) =>
+  bootstrapApplication(AppComponent, config, context);
 
 export default bootstrap;

integration/platform-server-zoneless/projects/standalone/src/main.server.ts

@@ -1,7 +1,8 @@
-import {bootstrapApplication} from '@angular/platform-browser';
+import {bootstrapApplication, BootstrapContext} from '@angular/platform-browser';
 import {AppComponent} from './app/app.component';
 import {config} from './app/app.config.server';
 
-const bootstrap = () => bootstrapApplication(AppComponent, config);
+const bootstrap = (context: BootstrapContext) =>
+  bootstrapApplication(AppComponent, config, context);
 
 export default bootstrap;

integration/platform-server/projects/standalone/src/main.server.ts

@@ -1,7 +1,8 @@
-import {bootstrapApplication} from '@angular/platform-browser';
+import {bootstrapApplication, BootstrapContext} from '@angular/platform-browser';
 import {AppComponent} from './app/app.component';
 import {config} from './app/app.config.server';
 
-const bootstrap = () => bootstrapApplication(AppComponent, config);
+const bootstrap = (context: BootstrapContext) =>
+  bootstrapApplication(AppComponent, config, context);
 
 export default bootstrap;

modules/ssr-benchmarks/src/main.server.ts

@@ -7,12 +7,13 @@
  */
 
 import {ɵenableProfiling} from '@angular/core';
-import {bootstrapApplication} from '@angular/platform-browser';
+import {bootstrapApplication, BootstrapContext} from '@angular/platform-browser';
 import {AppComponent} from './app/app.component';
 import {config} from './app/app.config.server';
 import {renderApplication, ɵENABLE_DOM_EMULATION} from '@angular/platform-server';
 
-const bootstrap = () => bootstrapApplication(AppComponent, config);
+const bootstrap = (context: BootstrapContext) =>
+  bootstrapApplication(AppComponent, config, context);
 
 /**
  * Function that will profile the server-side rendering

package.json

@@ -220,7 +220,8 @@
   },
   "pnpm": {
     "patchedDependencies": {
-      "[email protected]": "tools/pnpm-patches/dagre-d3-es+7.0.11.patch"
+      "[email protected]": "tools/pnpm-patches/dagre-d3-es+7.0.11.patch",
+      "@angular/ssr": "tools/pnpm-patches/@angular__ssr.patch"
     },
     "packageExtensions": {
       "grpc-gcp": {

packages/core/schematics/BUILD.bazel

@@ -114,6 +114,10 @@ bundle_entrypoints = [
         "application-config-core",
         "packages/core/schematics/migrations/application-config-core/index.js",
     ],
+    [
+        "add-bootstrap-context-to-server-main",
+        "packages/core/schematics/migrations/add-bootstrap-context-to-server-main/index.js",
+    ],
 ]
 
 rollup.rollup(
@@ -125,6 +129,7 @@ rollup.rollup(
         "//:node_modules/magic-string",
         "//:node_modules/semver",
         "//packages/core/schematics:tsconfig_build",
+        "//packages/core/schematics/migrations/add-bootstrap-context-to-server-main",
         "//packages/core/schematics/migrations/application-config-core",
         "//packages/core/schematics/migrations/control-flow-migration",
         "//packages/core/schematics/migrations/ngclass-to-class-migration",

packages/core/schematics/migrations.json

@@ -21,6 +21,11 @@
       "version": "21.0.0",
       "description": "Moves imports of `ApplicationConfig` from `@angular/platform-browser` to `@angular/core`",
       "factory": "./bundles/application-config-core.cjs#migrate"
+    },
+    "add-bootstrap-context-to-server-main": {
+      "version": "21.0.0",
+      "description": "Adds `BootstrapContext` to `bootstrapApplication` calls in `main.server.ts` to support server rendering.",
+      "factory": "./bundles/add-bootstrap-context-to-server-main.cjs#migrate"
     }
   }
 }