優化Angular Js電子商務項目

Question

我正在處理一個AngularJs項目，它的加載時間太長> 15秒。它有太多的Js和Css文件如何優化？當頁面第一次加載時加載所有內容。我想按需加載Js和Css。

從哪裏開始，以便我可以優化？請提出一些好的指導方針和工作流程。

Answer 1

幾點考慮：

1. 確保您的CSS，JavaScript和HTML文件被送達gzip編碼。這將顯着減少頁面加載時需要傳輸的數據量。

2. 確保您的JS和CSS被縮小，這消除了空白並減小了文件的大小。

3. 嘗試刪除大型龐大庫的依賴關係。 JQuery非常龐大，而且通常可以使用更輕量級的庫來代替。

4. 看看谷歌的PageSpeed模塊的Apache和NGINX。這可以執行一些神奇的任務，比如將你的javascript和css編譯成單個文件。 https://developers.google.com/speed/pagespeed/module/

5. 如果您使用兼容的網絡服務器，請考慮啓用HTTP2（或舊服務器上的SPDY）。

內容分發網絡

有人提倡使用公共內容分發網絡（CDN，比如maxcdn）來服務你的JavaScript文件。這有幾個潛在的優勢：

• 與流行的圖書館，很可能文件已被緩存在訪問您的網站的人的瀏覽器。

• CDN通常是全球分佈的，這應該使它們在全球範圍內快速響應。

但是，我個人不同意，並且確保我所有的第三方JavaScript庫都在本地提供服務。這裏的原因：

• 如果CDN脫機或有問題，你的網站就會被打破。如果一個CDN過載（雖然這可能有點用fallback loading修補）

• 或飽和，你的網站會也慢

• 其添加在頁面加載，這是失敗的

• 的另一點。如果CDN得到妥協至少一個額外的DNS查詢，有人可能會放置一些malicio我們的JavaScript在您的網站

• CDN提供的文件不能被內聯，合併，並通過谷歌的PageSpeed優化（這可以通過使用"integrity" checksum避免）

• CDN提供的文件無法與您的網站的其餘部分流水線