Angular-cli：啓動時間太慢

需要改進我的Angular2應用程序啓動時間。預設時間爲10-12秒。Angular-cli：啓動時間太慢

應用程序中有多個模塊，每個模塊都使用延遲加載進行加載。

這是我的package.json文件

{ 
    "name": "AppStore-cli", 
    "version": "0.0.0", 
    "license": "MIT", 
    "angular-cli": {}, 
    "scripts": { 
    "ng": "ng", 
    "start": "ng serve", 
    "lint": "tslint \"src/**/*.ts\"", 
    "test": "ng test", 
    "pree2e": "webdriver-manager update --standalone false --gecko false", 
    "e2e": "protractor" 
    }, 
    "private": true, 
    "dependencies": { 
    "@angular/common": "2.3.1", 
    "@angular/compiler": "2.3.1", 
    "@angular/core": "2.3.1", 
    "@angular/forms": "2.3.1", 
    "@angular/http": "2.3.1", 
    "@angular/material": "2.0.0-beta.1", 
    "@angular/platform-browser": "2.3.1", 
    "@angular/platform-browser-dynamic": "2.3.1", 
    "@angular/router": "3.3.1", 
    "@types/file-saver": "0.0.0", 
    "angular2-moment": "1.2.0", 
    "angular2-select": "1.0.0-beta.3", 
    "autotable": "1.0.0", 
    "core-js": "2.4.1", 
    "file-saver": "^1.3.3", 
    "jspdf": "1.3.2", 
    "jspdf-autotable": "2.3.1", 
    "md2": "0.0.16", 
    "ng2-auto-complete": "0.10.9", 
    "ng2-pagination": "2.0.0", 
    "ng2-slimscroll": "1.2.1", 
    "ng2-toastr": "1.4.1", 
    "rxjs": "5.0.1", 
    "ts-helpers": "1.1.1", 
    "zone.js": "0.7.2" 
    }, 
    "devDependencies": { 
    "@angular/compiler-cli": "2.3.1", 
    "@types/file-saver": "0.0.0", 
    "@types/jasmine": "2.5.38", 
    "@types/node": "6.0.42", 
    "angular-cli": "1.0.0-beta.28.3", 
    "codelyzer": "~2.0.0-beta.1", 
    "jasmine-core": "2.5.2", 
    "jasmine-spec-reporter": "2.5.0", 
    "karma": "1.2.0", 
    "karma-chrome-launcher": "2.0.0", 
    "karma-cli": "1.0.1", 
    "karma-jasmine": "1.0.2", 
    "karma-remap-istanbul": "0.2.1", 
    "protractor": "~4.0.13", 
    "ts-node": "1.2.1", 
    "tslint": "4.3.0", 
    "typescript": "~2.0.3" 
    } 
}

角cli.json

{ 
    "project": { 
    "version": "1.0.0-beta.28.3", 
    "name": "AppStore-cli" 
    }, 
    "apps": [ 
    { 
     "root": "src", 
     "outDir": "dist", 
     "assets": [ 
     "assets", 
     "favicon.ico", 
     "./images/" 
     ], 
     "index": "index.html", 
     "main": "main.ts", 
     "polyfills": "polyfills.ts", 
     "test": "test.ts", 
     "tsconfig": "tsconfig.json", 
     "prefix": "app", 
     "styles": [ 
     "styles.css", 
     "css/indigo-pink.css", 
     "css/admin.css", 
     "../node_modules/ng2-toastr/bundles/ng2-toastr.min.css" 
     ], 
     "scripts": [ 
     "../node_modules/core-js/client/shim.min.js", 
     "../node_modules/reflect-metadata/Reflect.js", 
     "../node_modules/jspdf/dist/jspdf.min.js", 
     "../node_modules/jspdf-autotable/dist/jspdf.plugin.autotable.js" 
     ], 
     "environments": { 
     "source": "environments/environment.ts", 
     "dev": "environments/environment.ts", 
     "prod": "environments/environment.prod.ts" 
     } 
    } 
    ], 
    "e2e": { 
    "protractor": { 
     "config": "./protractor.conf.js" 
    } 
    }, 
    "lint": [ 
    { 
     "files": "src/**/*.ts", 
     "project": "src/tsconfig.json" 
    }, 
    { 
     "files": "e2e/**/*.ts", 
     "project": "e2e/tsconfig.json" 
    } 
    ], 
    "test": { 
    "karma": { 
     "config": "./karma.conf.js" 
    } 
    }, 
    "defaults": { 
    "styleExt": "css", 
    "prefixInterfaces": false, 
    "inline": { 
     "style": false, 
     "template": false 
    }, 
    "spec": { 
     "class": false, 
     "component": true, 
     "directive": true, 
     "module": false, 
     "pipe": true, 
     "service": true 
    } 
    } 
}

我用以下命令來使建立

ng build --prod

這裏的screensort構建完成後的文件生成。

下面是加載時間的屏幕截圖。

任何人可以幫助我，我怎麼能啓動的時間減少到2-3秒或小於比？

感謝

來源

2017-03-17 Pinank Lakhani

有，你可以做幾件事：

運行ng build -prod -aot --stats-json
解決您可能遇到的任何錯誤（重建）
安裝webpack-bundle-analyzenpm install --save-dev webpack-bundle-analyzer
運行webpack-bundle-analyzer dist/stats.json
看看你的包和remov E以外的任何不必要的代碼
您的服務器上安裝壓縮（gzip）（這本身就應該供應商捆綁減少至〜400KB）

如果事情仍然緩慢，看看服務器端與普及，服務和網絡工作者渲染... Google可以幫助（;

也考慮升級到角4.0.0。它生成的代碼較少，然後2.x.x。

來源

2017-03-17 14:51:16 Sasxa

它給上納克構建-prod -aot --stats JSON的錯誤 ERROR在預期的值 'Ng2PaginationModule' 由模塊 ERROR在./src/main.ts 模塊進口未發現：錯誤：在無法解析 './$$_gendir/app/app.module.ngfactory' @ ./src/main.ts 7：29-76 @多./src/main.ts 試過很多如何解決，但仍然存在。不知道爲什麼 –

@PinankLakhani Yea，如果您沒有編寫AoT友好代碼，您可能會遇到錯誤。這可能很煩人（如果我沒有記錯，當你沒有在某個地方導入某個模塊時會發生這種特殊的錯誤。不確定這些錯誤是非常糟糕的，特別是在'2.x.x'中。 – Sasxa

Angular-cli：啓動時間太慢

回答

相關問題