Skip to content

fix(@schematics/angular): exclude es5 bundles from being prefetch #17905

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
Closed
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,8 @@
"/index.html",
"/manifest.webmanifest",
"/*.css",
"/*.js"
"/*.js",
"!/*-es5*.js"
Copy link
Member

Choose a reason for hiding this comment

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

If we are doing it, then we should also lazily cache the /*-es5*.js bundles (as shown in angular/angular#31256 (comment)).
There is no overhead for es2015 supporting browsers.

Copy link
Author

Choose a reason for hiding this comment

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

Good point

Copy link
Collaborator

Choose a reason for hiding this comment

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

It would be even better imo if we could adapt the ngsw-config.json template to the TS config target. Is it possible to do that, @alan-agius4?

A different tsconfig can be specified for each configuration. An application can various tsconfig, though this is probably not the norm.

That said, differential loading though is not only controlled via the target specified in the tsconfig, but also the result of the browserslists query.

@gkalpak, what would we the value to generate a different ngsw-config.json?

Copy link
Collaborator

Choose a reason for hiding this comment

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

In version 10 differential loading is on opt-in basis.

Copy link
Collaborator

Choose a reason for hiding this comment

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

I actually have some concerns about adding this.

For the reasons, that in version 11 we might want to change the generated bundle names not to have the syntax target as part of the filename.

See for more context: #17630 (review)

This would means that by adding this, we'd need to do a migration to migrate existing projects and replace the negate pattern.

Copy link
Member

Choose a reason for hiding this comment

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

So, what is the plan for differentiating es5 bundles vs es20XX bundles in v11?

Copy link
Collaborator

Choose a reason for hiding this comment

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

It hasn't been decided yet.

There are two 2 main option here, either leave the script target in the filename or change the filename not to contain it and use generic terms, like 'modern', legacy' etc...

Copy link
Author

Choose a reason for hiding this comment

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

This would means that by adding this, we'd need to do a migration to migrate existing projects and replace the negate pattern.

v11 is still many months away though, so while I do agree that not having es2015 in the bundle names is more future proof I think there is some value in introducing that logic now & doing a migration when v11 lands, especially as double (pre)fetching by the Angular Service Worker can be hard to detect when not looking for it.

Having said that I'll likely won't be the one writing the v11 migration code so I completely understand if you want to postpone that for now, and I'll try not to forget to update my ngsw-config.json for v11 :).

]
}
}, {
Expand All @@ -21,7 +22,8 @@
"resources": {
"files": [
"/assets/**",
"<%= resourcesOutputPath %>/*.(eot|svg|cur|jpg|png|webp|gif|otf|ttf|woff|woff2|ani)"
"<%= resourcesOutputPath %>/*.(eot|svg|cur|jpg|png|webp|gif|otf|ttf|woff|woff2|ani)",
"/*-es5*.js"
]
}
}
Expand Down