2017-03-30 35 views
1

我對前端開發很有新意,並且在使用angular2應用時遇到了一些問題。角2填充初始化需要太長時間

正如你可以看到下面的時間表捕獲,polyfills TAKS太長的時間(將近6秒!) chrome timeline 這似乎不是一個正常的。但是,我不知道我能做些什麼來減少這個填充時間。

conf的一些行。

// Add build specific plugins 
    if (ENV === 'build') { 
    config.plugins.push(
     // Reference: http://webpack.github.io/docs/list-of-plugins.html#noerrorsplugin 
     // Only emit files when there are no errors 
     new webpack.NoErrorsPlugin(), 

     // Reference: http://webpack.github.io/docs/list-of-plugins.html#dedupeplugin 
     // Dedupe modules in the output 
     new webpack.optimize.DedupePlugin(), 

     // Reference: http://webpack.github.io/docs/list-of-plugins.html#uglifyjsplugin 
     // Minify all javascript, switch loaders to minimizing mode 
     new webpack.optimize.UglifyJsPlugin({ 
      compress: { warnings: false } 
     }) 
    ); 
    } 

整個webpack.config.js我在我的應用程序中使用。 https://gist.github.com/jeesim2/484186d630fedc9f42e264ca905ad123

我的角度版本

"@angular/common": "^2.0.1", 
"@angular/compiler": "^2.0.1", 
"@angular/core": "^2.0.1", 
"@angular/forms": "^2.0.1", 
"@angular/http": "^2.0.1", 
"@angular/platform-browser": "^2.0.1", 
"@angular/platform-browser-dynamic": "^2.0.1", 
"@angular/router": "^3.0.1", 

webpack.optimize.UglifyJsPlugin封裝尺寸減少到70%,但頁面加載速度並沒有得到更快。 enter image description here

什麼導致這種長頁面加載?

回答

0

歡迎來到angular2單頁應用:)。 A2仍然處於開發狀態。這種行爲是正常的,取決於OS /瀏覽器/組件編號渲染需要幾秒鐘。由於A2/vendors/polyfills的捆綁文件大約爲800kb +(最小化),因此需要一些時間才能將所有內容全部讀取到瀏覽器內存中。

您可以檢查渲染速度是否相當快,但腳本可以在初始化後的幾秒鐘內在後臺運行。即使在快速PC上也需要一些時間。

這是由https://github.com/angular/zone.js/