On updating to new angular build system (application builder), UI becomes extremely slow in Angular 18 and 20

[cool-akash]

Command

build, serve

Is this a regression?

• Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was

Yes, this behavior used to work in the previous version. Previous version: @angular-devkit/build-angular:browser (browser builder). The UI was performant before migrating to @angular-devkit/build-angular:application (esbuild/vite-based application builder).

Description

After migrating from the deprecated @angular-devkit/build-angular:browser builder to the new @angular-devkit/build-angular:application builder, the application UI becomes noticeably slow and unresponsive. Interactions such as navigating between views, opening dialogs, and rendering data-heavy components exhibit significant lag compared to the browser builder output.

The issue appears to be related to how the application builder bundles and serves the application — the runtime behavior of the served/built output is degraded, not the build speed itself.

This was not observed when using the browser builder with the same codebase and Angular version.

Minimal Reproduction

Start with an existing Angular workspace using @angular-devkit/build-angular:browser
Verify the application runs smoothly with ng serve
Migrate the builder from browser to application in angular.json:
Update angular.json options to match the new builder schema (replace main with browser, remove buildOptimizer, etc.)
Run ng serve again
Interact with the UI — navigation, dialogs, data rendering are all noticeably slower
Expected: UI performance should be equivalent or better than the browser builder output.
Actual: UI is sluggish and unresponsive after switching to the application builder.

Exception or Error

No errors or exceptions in the console. The issue is purely a runtime performance degradation.

Your Environment

Angular CLI: 20.3.6
Node: 24.0.0
Package Manager: npm
OS: Windows

Angular: 20.3.6


Package                         Version
---------------------------------------------------------
@angular-devkit/build-angular   20.3.6
@angular/animations             20.3.6
@angular/common                 20.3.6
@angular/compiler               20.3.6
@angular/core                   20.3.6
@angular/forms                  20.3.6
@angular/platform-browser       20.3.6
@angular/platform-browser-dynamic 20.3.6
@angular/router                 20.3.6
@microsoft/signalr              ^10.0.0
rxjs                            ^7.8.1
tslib                           ^2.7.0
zone.js                         ~0.15.1
typescript                      ~5.8.3

Anything else relevant?

This is not browser-specific — observed in both Chrome and Edge (latest versions).
The workspace contains multiple Angular application projects and library projects (using ng-packagr).
The performance degradation is visible both in dev mode (ng serve) and production builds (ng build).
Reverting the builder back to browser immediately restores normal UI performance.
IDE: VS Code. OS: Windows 10/11.

[alan-agius4]

This seems like a bug but we'll need to look at a reproduction to find and fix the problem. Can you setup a minimal repro please?

You can read here why this is needed. A good way to make a minimal repro is to create a new app via ng new repro-app and adding the minimum possible code to show the problem. Then you can push this repository to github and link it here.

This might be related to your directory structure so its really important to get an accurate repro to diagnose this.