2

I have a Material module that contains imports/exports for Angular Material components.

import { NgModule } from '@angular/core';
import {
  MdToolbarModule,
  MdIconModule,
  MdSidenavModule,
} from '@angular/material';

@NgModule({
  imports: [
    MdToolbarModule,
    MdIconModule,
    MdSidenavModule,
  ],

  exports: [
    MdToolbarModule,
    MdIconModule,
    MdSidenavModule,
  ],
})

export class MaterialModule {}

I import and export MaterialModule in SharedModule.

import { NgModule } from '@angular/core';

// Modules
import { MaterialModule } from './material.module';

@NgModule({
  imports: [
    MaterialModule,
  ],
  declarations: [
    // components
  ],
  exports: [
    MaterialModule,

    // components
  ],
  providers: [
    // utils
  ]
})
export class SharedModule {}

For example, I import SharedModule to use its components and also so that I won't have to import Angular Material components over and over again in each module I create that uses Angular Material. I import SharedModule to ExampleModule, but ExampleModule only uses MdIconModule from MaterialModule. Let's say this is common practice throughout a big application. Does it affect performance both in dev mode and production mode (AOT build)?

jeanl
  • 379
  • 2
  • 7
  • 18
  • Possible duplicate of [Do unused components in shared modules slows down my application?](https://stackoverflow.com/questions/45024406/do-unused-components-in-shared-modules-slows-down-my-application) – Sangwin Gawande May 18 '18 at 08:48

1 Answers1

0

I think your setup is fine and quite follows the Angular docs's recommendation. You can also explore your bundle size when build in production to double check.

I believe we even get better with tree shaking in the coming Ivy compiler.

sugarme
  • 751
  • 5
  • 9