在 AppModule 中导入不必要的模块会减慢 Angular 2 应用程序的速度吗？答案

【问题标题】：Does import of unnecessary modules in AppModule slow down the Angular 2 app?在 AppModule 中导入不必要的模块会减慢 Angular 2 应用程序的速度吗？
【发布时间】：2019-02-20 10:46:01
【问题描述】：

在 angular(2/4/6) 应用程序中，如果我们在 app 模块中导入不必要的模块，会降低应用程序的速度。

它会影响应用程序的性能吗？

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

【问题讨论】：

你所说的性能是什么意思？
@Jota.Toledo 它会加载那些不必要的模块吗？
是的，它会加载这些，您可以将功能移动到它自己的功能模块并延迟加载它们。这样，最初只会加载根据 URL 请求的功能。仅供参考，我指的是 imports: [] 而不是 Typescript 导入语句。

标签： javascript angular angular2-modules

【解决方案1】：

Yomateo 正确地说，在执行构建时，tree shaking 会处理未使用的模块/模块操作符。

摇树器从上到下遍历依赖关系图，并像树上的枯叶一样摇出未使用的代码

但是执行构建所需的时间有所不同，因为构建包含更多模块的应用程序需要更长的时间，即使它们从未使用过，并且如果导入更多模块，则构建大小会更大。

所以要回答您的问题，性能不会受到影响，但是会影响构建时间和构建大小。

Source

【讨论】：

【解决方案2】：

如果您导入一个模块并且从不使用它.. 它将会被抛在后面。这是编译器提供的“摇树”的最大优势之一。也称为“死代码”。

另一方面，从模块中引用不必要的代码会增加（或如您所说的那样膨胀）您的发行版大小，并且还需要浏览器将此代码读入内存。

【讨论】：

【解决方案3】：

导入不必要的模块会显着增加您的应用程序大小。它也适用于您可能想要使用的任何角度模块，包括第三方的。

【讨论】：

@Kooldandy 询问的是性能而不是应用程序的大小。请详细说明。
@MartinCh 是的，我在问性能。它会影响性能还是需要更多时间来加载捆绑包？