Tuesday, May 22, 2018

Angular 6–Dependency Injection changes

One of the smaller changes that the Angular team introduced with the Angular 6 release is the support for tree-Shakable providers.

From the documentation:

Tree shaking is the ability to remove code that is not referenced in an application from the final bundle. Tree-shakable providers give Angular the ability to remove services that are not used in your application from the final output. This significantly reduces the size of your bundles.

To enable this scenario, you have to change your code and move from modules referencing services to services referencing modules.

Until now we always provided a service by registering it as part of our ngModule providers:

The problem with the code above is that the Angular compiler cannot identify at build time if this service will be required or not. Because it's always possible to inject a service directly using injector.get(Service), Angular cannot identify all of the places in your code where this injection could happen. Thus, services provided in modules are not tree-shakeable.

To make our service tree-shakeable, the information about how to construct an instance of the service (the provider definition) needs to be a part of the service class itself.

Remark: If necessary you can further configure the service using a factory function on the injector.

No comments: