Does import of unnecessary modules in AppModule slow down the Angular 2 app?

Question

In angular(2/4/6) application if we import unnecessary modules in app module will that slow down the application.

Does it impact on the performance of the application ?

@NgModule({
  imports: [
    BrowserModule.withServerTransition({ appId: 'myId' }),
    FormsModule,
    AppRoutingModule,
    HttpClientModule,
    HttpClientInMemoryWebApiModule,
    AaModule,
    BbModule
  ],
  declarations: [
    AppComponent,
    AdminComponent
  ],
  providers: [  ],
  bootstrap: [ AppComponent ]
})

Yes it will load those, you can move features to its own feature modules and lazy load them. This way only requested feature as per URL will be loaded initially. FYI I am referring to `imports: []` not Typescript import statement. — sabithpocker, Feb 20 '19 at 11:32

score 9 · Answer 1 · answered Feb 20 '19 at 11:21

Yomateo is correct to say that tree shaking will take care of unused modules/module operators when build is performed.

A tree shaker walks the dependency graph, top to bottom, and shakes out unused code like dead leaves in a tree

There is however a difference in the amount of time it takes to perform the build, as it takes longer to build apps with more modules included even though they are never used and the build size is larger if more modules are imported.

So to answer your question the performance will not be affected, however, build time and build size will be affected.

Source

score 4 · Answer 2 · answered Feb 20 '19 at 11:11

If you import a module and never use it.. it will be left behind. This is one of the biggest advantages of "trees shaking" that the compiler provides. Also known as "dead code".

Referencing unnecessary code from modules on the other hand will increase (or bloat as you call it) your distribution size and will also require that the browser reads this code into memory.

score 1 · Answer 3 · answered Feb 20 '19 at 10:49

1

Importing unnecessarily module bloats your application size significantly. It also applies to any angular module you might want to use, including third-party ones.

answered Feb 20 '19 at 10:49

Ofir Lana

383
5
13

@Kooldandy asked about the performance not the size of the application. Please elaborate more. – Martin Ch Feb 20 '19 at 10:57
@MartinCh yes I am asking about the performance. Does it impact on the performance or will it takes more time to load the bundle ? – Kooldandy Feb 20 '19 at 11:06

Does import of unnecessary modules in AppModule slow down the Angular 2 app?

3 Answers3