11

I am new to angular2 and following the heros tutorial from docs. I am experiencing quite slow development experience with angular2. It takes about 5 secs for angular2 to detect changes in file, and then next 30-40 seconds to reload the page.

[0] 8:08:12 PM - File change detected. Starting incremental compilation...
[0] app/hero-detail.component.ts(2,8): error TS1192: Module '"app/app.component"' has no default export.
[0] 8:08:16 PM - Compilation complete. Watching for file changes.
[1][BS] File changed: app\app.component.js
[1] [BS] File changed: app\hero-detail.component.js
[1] [BS] File changed: app\main.js
[1] 16.02.07 20:08:39 304 GET /./index.html (Unknown - 8551ms)
[1] 16.02.07 20:08:45 304 GET /./index.html (Unknown - 1145ms)
[1] 16.02.07 20:08:45 304 GET /node_modules/es6-shim/es6-shim.min.js (Unknown - 384ms)
[1] 16.02.07 20:08:45 304 GET /node_modules/systemjs/dist/system-polyfills.js (Unknown - 393ms)
[1] 16.02.07 20:08:45 304 GET /node_modules/angular2/bundles/angular2-polyfills.js (Unknown - 399ms)
[1] 16.02.07 20:08:46 304 GET /node_modules/systemjs/dist/system.src.js (Unknown - 906ms)
[1] 16.02.07 20:08:46 304 GET /node_modules/rxjs/bundles/Rx.js (Unknown - 911ms)
[1] 16.02.07 20:08:47 304 GET /node_modules/es6-shim/es6-shim.min.js (Unknown - 962ms)
[1] 16.02.07 20:08:47 304 GET /node_modules/systemjs/dist/system-polyfills.js (Unknown - 967ms)
[1] 16.02.07 20:08:47 304 GET /node_modules/angular2/bundles/angular2.dev.js (Unknown - 972ms)
[1] 16.02.07 20:08:47 304 GET /node_modules/angular2/bundles/angular2-polyfills.js (Unknown - 977ms)
[1] 16.02.07 20:08:48 304 GET /node_modules/systemjs/dist/system.src.js (Unknown - 1429ms)
[1] 16.02.07 20:08:48 304 GET /node_modules/rxjs/bundles/Rx.js (Unknown - 1431ms)

Although this time may seems not significant but when I have to make regular changes and check output, it starts to add up.

Any suggestions why angular2 is slow in development..??

hhsadiq
  • 2,871
  • 1
  • 25
  • 39
  • Any reason why someone down-voted my question...??? I am developing angular2 apps and getting too slow performance in development and want a way to speed it up... – hhsadiq Feb 09 '16 at 03:30

3 Answers3

6

Problem

The problem was not with angular2, rather it was with Windows/Antivirus as they were slowing down node.js due to their so-called security measures.

Solution

  • Disable realtime protection from windows defender (or any other antivirus), as it slows down node.js
  • Run console (or gitbash if you use that) as an administrator
  • Use SSD drive

Ultimate Solution

The constant problems of performance and node modules not being installed, forced me to completely ditch Windows. And the day I shifted to mac, node and angular development experience was WAY better, the difference was like dark-night and full-sunny-shiny-broady-day.

More details

Read this excellent answer to get more details.

Community
  • 1
  • 1
hhsadiq
  • 2,871
  • 1
  • 25
  • 39
1

You can also try to have lite-server not monitor your node_modules directory. See here for config instructions: https://github.com/johnpapa/lite-server

  • Add a bs-config.json to your project and specify files to watch for a reload

    {
"port": 8000,
"files": ["./app/**/*.{html,htm,css,js}", "./*.{html,css,js,json}"],
"server": { "baseDir": "./" }
}

  • Add the config file to your startup in packages.json

    {
  ...
  "scripts": {
    ...
    "lite": "lite-server -c bs-config.json",
David Faivre
  • 2,302
  • 3
  • 23
  • 25
0

you can run project add --aot param, such as

ng serve --aot
Chio Quavario
  • 581
  • 4
  • 3