我现在的前端开发环境用着 webpack-dev-server ,之前在手机上调试的时候,打开页面一直很慢。
因为dev环境中的js太大了,比如一个页面dev环境13.6MB,里面有一堆core-js的内容和sourcemap,而prod模式编译之后,其实才2.1M。
mac上打开页面没有性能问题,可以做到瞬间传输完毕。但手机打开的时候,传输速度在2MB/s到3MB/s之间,不懂为什么达不到路由器的上限速度,平时迅雷下载的时候10MB/s是正常的。我也有点怀疑是微信客户端限制了手机的下载速度。这样一来,每次打开页面光是等待数据传输都要等待6s左右,很难忍受。
解决办法也很简单,打开webpack-dev-server的compress选项就好了。gzip之后,13.6MB的内容就只用传输2.9MB,是原来的21%体积。
https://webpack.js.org/configuration/dev-server/#devservercompress