webpack構建速度優化

webpack構建速度優化

常規優化方法

分離基礎腳本

1. 使用webpack.DllPlugin優化，其實並無優化速度，只是把一些不須要常常變動的部分提早構建，以後只須要構建變動的部分就能夠了，確實優化了時間
2. 使用external,不構建基礎腳本，使用外部腳本引入，確實減小了時間

多進程構建

1. loader多進程，happypack，據測試沒有提高速度，也許是webpack4.0已經使用了多進程
2. 壓縮多進程，UglifyJsPlugin開啓parallel: true稍微提高了一些速度

使用cache

1. loader的cache開啓，第一次不會有提高，以後提高巨大，必定要開啓，強烈推薦
2. 使用HardSourceWebpackPlugin，再cache基礎之上仍然有巨大的提高，強烈推薦

綜上 使用緩存和剝離基礎代碼是優化的二種主要策略，多進程策略應該會在後續webpack版本中發揮愈來愈弱的做用。

webpack仍是太煩，配置依然不少，難道前端工程必定要依賴webpack嗎？

關注個人微信公衆號，更多優質文章定時推送