3

I have these two imports almost on every components module:

import { CommonModule } from '@angular/common';
import { RouterModule } from '@angular/router';

Is it possible to only have them imported to the global app.component / module where they can be shared?

I'm wanting to be more efficient with my imports because it seems to be effecting my app loading.

Currently my app takes 4 seconds to load and I believe its because of the imports. I have many and want to refactor how I use them.

Also, I'm open to other ideas on how best to import.

My overall goal is to speed up my app down to 2 seconds by doing less imports on all my components.

AngularM
  • 15,982
  • 28
  • 94
  • 169
  • What makes you think it's the imports? If speed is an issue, have you looked into AOT compilation? – jonrsharpe Dec 05 '16 at 23:14
  • My app when I run it always has a delay of four seconds on load and refresh. – AngularM Dec 05 '16 at 23:16
  • That answers neither question... – jonrsharpe Dec 05 '16 at 23:17
  • I've had a look at that and it looks hard to implement. I'm new to angular 2. I'm using an angular 2 app with typescript and systemjs currently – AngularM Dec 05 '16 at 23:19
  • *"My overall goal is to speed up my app down to 2 seconds"* - OK! *"by doing less imports"* - see above. What if you do fewer imports and performance doesn't improve? *"it looks hard to implement"* - that doesn't mean it isn't worth doing, if you have a specific performance issue. – jonrsharpe Dec 05 '16 at 23:20
  • Also I'd advise you stop your current practice of posting duplicates of http://stackoverflow.com/questions/40894704/how-can-i-improve-load-performance-of-angular2-apps on a daily basis. At least wait for the bounty to finish - at the moment you're spreading information over multiple questions, which just makes it harder for anyone else with similar problems to find. – jonrsharpe Dec 05 '16 at 23:26
  • Will it work with systemjs ? – AngularM Dec 05 '16 at 23:26
  • I've no idea, sounds like a useful thing for you to start researching. Perhaps if all of the advice you're getting is to do things you can do in webpack but not systemjs, that leads you to an obvious conclusion. – jonrsharpe Dec 05 '16 at 23:27
  • Il have a go at aot tomorrow. Also is there a global place to put imports that are commonly used? – AngularM Dec 05 '16 at 23:28
  • You should make the switch over to webpack. This is the problem with SystemJS, that it loads a bunch of single files. Has nothing to do with class imports. (Technically it does - SystemJS will load the file only once, when any files uses it). With Webpack all the files can be bundled into one main file. – Paul Samsotha Dec 06 '16 at 01:33

1 Answers1

2

You can create a shared module and export all the modules or components you want to use in the application, then all you need is just to import that shared module.

That's how you can create a shared module: SharedModule

Terai
  • 311
  • 1
  • 4
  • 13