webpack 項目優化實踐

背景

項目其實已經通過幾回優化，目前有點時間，想在原來的基礎上繼續優化下，看看還有沒有其它能夠優化的地方，畢竟可以快一點，就快一點，快一點老是比慢一點好

目前是這樣的

backend.js是什麼？

這個文件之前沒有注意到，此次看到不知道爲何會有這個js文件，不知道是用來作什麼的，項目中並無引入這個js文件。

這個是devtool的引入的js，若是沒有安裝devtool就不會引入這個js，因此這個不須要優化。

dllself 文件

能夠看到dllself這個文件壓縮後，還有差很少311kb，時間差很少佔了一半的時間，這個體積有點大，能夠想辦法把它的體積減小一點。 測試了一下，當包含anzi-ui的時候，打包體積

去除anzi-ui的時候，打包體積

能夠看到明顯少了一倍還多，最終決定把anzi-ui這個庫，從webpack dll 裏邊去掉，放到業務代碼裏邊

測試一下

能夠看到dllself的下載時間從2.68s直接降低到了34ms，降低了差很少90%，雖然main.xx.js的體積相應的增大了，可是下載時間並無增長不少，從4.81s到4.26s, 並無多大的變化。

main.js優化

從圖上還能夠看到main.js的時間基本上最大的了，基本上佔了4s左右，基本上90%的時間都是在這裏了。 根據28原則，首先思考下，如何優化這裏的時間。