找到nginx多网站配置文件:类似nginx/网站/www.baidu.com
参考页面:https://router.vuejs.org/zh-cn/essentials/history-mode.html
<强> cnpm运行构建文件过大
打包生成文件:
浏览器访问效果:
<强> Nginx开启gzip
找到nginx.config。关于gzip压缩代码:
上面为数据流接收大小,下面为解压后实际大小。
<>强识别gzip与非gzip请求
gzip请求:
非gzip请求:
gzip与非gzip在响应头中区别就是内容编码是否表明是gzip压缩格式。
而上面通过接收数据与实际数据大小相比也能明显看出差异
<强> webpack gzip
vue项目中配置/index.js
开启后cnpm运行构建会生成*。广州文件。
像这样:
上传到服务器、测试查看接受文件大小。
gzip相应539 kb。并非加载应用.........广州的412 kb
删除* . gz文件,依旧539 kb。
莫非,webpack打包gzip文件毫无卵用? ? ? ? ? ?
<强> gzip_static静态压缩
经过一番百度。得一宝贝.gzip_static
什么东东呢?字面上意思就是:gzip静态。
卖个关子:
上面配置了.Nginx是可以开启gzip压缩,而且能够实现压缩效果。而它是如何工作的呢?
客户端发起请求
——》Nginx接收请求
——》Nginx加载文件进行gzip打包压缩成* . gz
——》返回给浏览器
——》浏览器解压*。广州(应该是它干的,反正看不见)
也就是说,每次请求,Nginx都会进行压缩返回,压缩返回,压缩返回,将会导致浪费大量CPU。
这么个大虫子是谁设计的?如果请求量大,CPU会不会挂掉吗?//猜测
当然,并不会,gizp打包压缩后会临时缓存,
所以,能不消耗CPU就不消耗CPU。
废话太多,步入正题。放大招! !
nginx。参看
后:
对比文件:
。开启gzip_static后。流程就会变成
