string.replace() using regular expression with the escaped symbols "\‘" and "\’" produces unexpected result in production

[phuctvt]

Which @angular/* package(s) are the source of the bug?

Don't known / other

Is this a regression?

Yes

Description

The following code (notice the symbols ‘ and ’):

'‘The year is 2019’'.replace(/[\‘\’]/g, '')

will produce 'The year is 2019' in development mode (expected), but '‘The year is ’' in production mode (unexpected).

The ‘ and ’ are \u2018 and \u2019 so I guess Angular somehow transformed them to plain text in production mode, I think that is the reason.

After migrating my project from Angular 4 to 12, I found this issue, it didn't happen in Angular 4, but not sure it happened since which version.

In the point of view of regular expression, the ‘ and ’ are not special symbols like . or *, so it doesn't need \, it means/[‘’]/g is enough, and when using like that the issue will not happen. But anyway, I think the issue is kind of serious for me, because developers will be surprised when seeing the result in production mode.

Please provide a link to a minimal reproduction of the bug

https://stackblitz.com/edit/angular-ivy-zwf1us

It also happens in ng serve --configuration=production, so you can quickly reproduce the issue.

Please provide the exception or error you saw

No response

Please provide the environment you discovered this bug in (run ng version)

Angular CLI: 12.2.1
Node: 16.6.2 (Unsupported)
Package Manager: npm 7.20.3
OS: darwin arm64

Angular: 
... 

Package                      Version
------------------------------------------------------
@angular-devkit/architect    0.1202.1 (cli-only)
@angular-devkit/core         12.2.1 (cli-only)
@angular-devkit/schematics   12.2.1 (cli-only)
@schematics/angular          12.2.1 (cli-only)

[alan-agius4]

Hi @phuctv95,

This is expected and the reason for this is that for production builds JS is minified and outputted in ASCII only mode. This is also the default behaviour of other other tools such as https://esbuild.github.io/api/#charset.

ASCII has performance benefits for JS parse time. From previous discussions with the Chrome team it was recommended to use ASCII whenever possible as V8 has optimized parse and scanning paths for ASCII scripts and in particular ASCII-only identifiers https://v8.dev/blog/scanner.

Providing an option to disable the ASCI mode is not something that we'd like to add to our API, especially considering that the workaround is trivial and this is the first issue being reported since we started outputting ASCII-only in early 2017.

My suggestion would be to amend the RegExp to:

'‘The year is 2019’'.replace(/[\u2018\u2019]/g, '');

We can re-evaluate our position in the future if we see more users are experiencing issue around this.

[phuctvt]

ASCII has performance benefits for JS parse time. From previous discussions with the Chrome team it was recommended to use ASCII whenever possible as V8 has optimized parse and scanning paths for ASCII scripts and in particular ASCII-only identifiers https://v8.dev/blog/scanner.

Providing an option to disable the ASCI mode is not something that we'd like to add to our API, especially considering that the workaround is trivial and this is the first issue being reported since we started outputting ASCII-only in early 2017.

That makes sense, thank you for the explanation and the suggestion too 👍!

[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.}