如何提高JS文件加載性能（AngularJS）？

我的網絡性能存在問題，問題在於頁面加載視圖時出現延遲。如何提高JS文件加載性能（AngularJS）？

我在Chrome中查看了開發工具，我發現大部分時間都是加載angular.js,angular-material.js和angular.material.css。下面

見圖片有我如何添加庫。

<script src="bower_components/angular/angular.js"></script> 
    <script src="js/jquery-3.1.1.min.js"></script> 
    <script src="bower_components/angular-material-data-table/dist/md-data-table.min.js"></script> 
    <script src="bower_components/angular-aria/angular-aria.js"></script> 
    <script src="bower_components/angular-animate/angular-animate.js"></script> 
    <script src="bower_components/angular-material/angular-material.js"></script>

是否有可能提高負載的性能？

來源

2017-03-21 Nelson Biggety

檢查以下東西

您正在使用這些庫的開發版本..使用minified versions提高性能
。轉到該文件夾並找到angular.min.js並加入。同樣，所有圖書館都使用縮小版本。
在Web服務器上啓用gzip壓縮以進一步縮小尺寸。
啓用資源緩存（添加緩存標頭）以在本地緩存資源，以便下次不會下載。
將async & defer添加到腳本標記以避免渲染阻止下載資源。

來源

2017-03-21 12:31:11

更改每個腳本縮小版本我會盡量休息。 –

您可以使用minified files這是AngularJS和角料真的體積較小：

angular.js爲1.2MB，縮小的是160Ko。 Source
angular-material.js是1.2MB，縮小爲290Ko。 Source

這樣做，你會81％提高你的加載時間對這些文件。

_{詳細說明：100 - [450 * 100 /（1200 + 1200）] = 81.25％}

來源

2017-03-21 12:31:41 Mistalis

-1

如果看到它們的尺寸，它們比其他庫更大。也許它可以是一些服務器配置下載更大的文件？它可以是某種分割。

來源

2017-03-21 12:31:58 Diego

如何提高JS文件加載性能（AngularJS）？

回答

相關問題