Skip to content

Conversation

clydin
Copy link
Member

@clydin clydin commented Dec 4, 2024

TypeScript 5.6 and higher added functionality that will search for a package.json file for source files that are part of the program (e.g., .d.ts) and within a node modules directory. This can be an expensive task especially considering the large amount of .d.ts files within packages. TypeScript supports using a cache of known package.json files to improve the performance of this task. The Angular CLI will now provide and reuse this cache across rebuilds during watch mode. This includes the use of ng serve.

The performance difference is most apparent for the Angular template diagnostic step of the build. Internally the Angular compiler creates a new template typechecking program which causes the package.json search process to occur. By leveraging the cache, this process becomes a series of cache hits. In the event that files are modified within the node modules directory, the cache is invalidated and the following rebuild may be longer as a result.

Previous:

DURATION[NG_DIAGNOSTICS_TOTAL]: 0.040498750s
DURATION[NG_DIAGNOSTICS_SYNTACTIC]: 0.000079378s [count: 265; avg: 0.000000300s; min: 0.000000166s; max: 0.000003042s]
DURATION[NG_DIAGNOSTICS_SEMANTIC]: 0.000095121s [count: 265; avg: 0.000000359s; min: 0.000000250s; max: 0.000004500s]
DURATION[NG_DIAGNOSTICS_TEMPLATE]: 0.040161625s [count: 1; avg: 0.040161625s; min: 0.040161625s; max: 0.040161625s]

Now:

DURATION[NG_DIAGNOSTICS_TOTAL]: 0.007495333s
DURATION[NG_DIAGNOSTICS_SYNTACTIC]: 0.000082327s [count: 265; avg: 0.000000311s; min: 0.000000208s; max: 0.000002750s]
DURATION[NG_DIAGNOSTICS_SEMANTIC]: 0.000109290s [count: 265; avg: 0.000000412s; min: 0.000000291s; max: 0.000003875s]
DURATION[NG_DIAGNOSTICS_TEMPLATE]: 0.007141042s [count: 1; avg: 0.007141042s; min: 0.007141042s; max: 0.007141042s]

TypeScript 5.6 and higher added functionality that will search for a
`package.json` file for source files that are part of the program (e.g., `.d.ts`)
and within a node modules directory. This can be an expensive tasks especially
considering the large amount of `.d.ts` files within packages. TypeScript supports
using a cache of known `package.json` files to improve the performance of this task.
The Angular CLI will now provide and reuse this cache across rebuilds during watch
mode. This includes the use of `ng serve`.

The performance difference is most apparent for the Angular template diagnostic
step of the build. Internally the Angular compiler creates a new template typechecking
program which causes the `package.json` search process to occur. By leveraging the
cache, this process becomes a series of cache hits. In the event that files are modified
within the node modules directory, the cache is invalidated and the following rebuild
may be longer as a result.
@clydin clydin added the target: patch This PR is targeted for the next patch release label Dec 4, 2024
@angular-robot angular-robot bot added area: performance Issues related to performance area: @angular/build labels Dec 4, 2024
@clydin clydin requested a review from alan-agius4 December 4, 2024 21:29
@clydin clydin added the action: review The PR is still awaiting reviews from at least one requested reviewer label Dec 4, 2024
Copy link
Collaborator

@alan-agius4 alan-agius4 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@alan-agius4 alan-agius4 added action: merge The PR is ready for merge by the caretaker target: minor This PR is targeted for the next minor release and removed action: review The PR is still awaiting reviews from at least one requested reviewer target: patch This PR is targeted for the next patch release labels Dec 5, 2024
@alan-agius4
Copy link
Collaborator

@clydin this does not apply cleanly on the patch branch.

@alan-agius4 alan-agius4 merged commit 75998eb into angular:main Dec 5, 2024
35 of 36 checks passed
@clydin clydin deleted the application/ts-package-cache branch December 5, 2024 12:28
@angular-automatic-lock-bot
Copy link

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.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Jan 5, 2025
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

action: merge The PR is ready for merge by the caretaker area: @angular/build area: performance Issues related to performance target: minor This PR is targeted for the next minor release

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants