Different behaviour build in watch-mode between webpack and esbuild when using @angular/localize

[pkoppers-22]

Command

build

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

Any version using "@angular-devkit/build-angular:browser"

Description

In an app we're using Angulars i18n translation (with json files) to build for a few different languages. When we started using this form of translation we were still using de webpack builder. For testing functionality we were using "ng build --watch --configuration=developent...." with in angular.json "localize": true for the development configuration. Changed files were the only ones used in an incremental build and we could copy the build to a test-server for functional testing.
After changing to esbuild (as of Angular 17) we noticed a change in behaviour when using the build in watch mode. If only 1 source file changed a whole new rebuild was made. When trying to find the cause of this change we also noticed this complete rebuild after using the touch command an a source file. Disabling localize in the development configuration will solve this change in behaviour, but then we can not test the translations with a regular development build.

Is this change in watch-mode behaviour as it should be? We consider it a bug as this change in behaviour isn't documented.

Minimal Reproduction

Reproduction is simple.
Create a new app with "ng new repro-app" with defaults (CSS and no SSR).
Add localization with "ng add @angular/localize".
Make no changes to angular.json.

Start build in watch mode with "ng build --watch --configuration development --localize=true"
Make a change to the stylesheet and see the complete rebuild.

End the watch mode and start a new one with localize=false.
Make another change to the stylesheet and see the incremental build (only stylesheet).
This is the same as using the webpack builder with localize=true.

Exception or Error

Your Environment

Angular CLI: 19.1.6
Node: 20.16.0
Package Manager: npm 10.8.1
OS: linux x64

Angular: 19.1.5
... animations, common, compiler, compiler-cli, core, forms
... localize, platform-browser, platform-browser-dynamic, router

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1901.6
@angular-devkit/build-angular   19.1.6
@angular-devkit/core            19.1.6
@angular-devkit/schematics      19.1.6
@angular/cli                    19.1.6
@schematics/angular             19.1.6
rxjs                            7.8.1
typescript                      5.7.3
zone.js                         0.15.0

Anything else relevant?

We're currently using Angular 18 for building web-apps but will be migrating to 19 soon. If there is a way to change this behaviour without change the current configurations (in angular.json) I would like to know.

If this isn't a bug I also would like to know. In this case we would have to change code in our development tool how dev. builds are made and how watch mode is started.

Thanks in advance.

[pkoppers-22]

@alan-agius4 does this also change the buildtime difference?
Incremental webpack/browser builds with localize were much faster than the localized rebuilds with esbuild application builder.
Seeing your commit it seems you only changed the logging.

[alan-agius4]

This change only affects logging, which previously included unchanged files when using localization. With regards to performance, I suspect that we could cache some parts of the inlining process, I should have something later today.

[alan-agius4]

@pkoppers-22 FYI #29606

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}