前端性能优化:nginx压缩文件

页面很多时候都是去加载一些静态文件。
作为高性能服务器的nginx可以通过一些命令去压缩文件以达到提高响应速度的梦想。

  1. 找到配置文件nginx.conf
  2. 在 http模块下、(http下)server之前添加如下代码:
gzip	on;
gzip_proxied	any;
gzip_min_length		要压缩页面的最小大小;
gzip_buffers	倍数 单位;   #如:4 8k
gzip_comp_level	压缩级别;   
gzip_types	text/plain text/css application/x-javascript application/javascript application/xml;
gzip_static	on;
gzip_http_version	1.0;
add_header Vary Accept-Encoding gzip;

gzip_proxied any; —— 指定:nginx做前端代理时,无条件启用压缩;
gzip_comp_level :设置压缩级别,最大为9,最小为1,此值越大,压缩时间越短;
gzip_buffers :设置系统获取几个单位的缓存用于存储gzip的压缩结果数据流,如本例中数值——按照原始数据大小以8K为单位申请4倍大小内存空间
add_header Vary Accept-Encoding gzip;:代替指令gzip_vary on;,用于在使用gzip功能时发送带有Vary:Accept-Encoding头域的响应头部——这对于本身不支持gzip压缩的客户端浏览器是有用的

哦对了,更改完配置以后别忘了 重启

nginx -s reload

Gzip压缩与IE6浏览器脚本运行问题:
IE6浏览器对gzip功能的支持非常不完善。

根据笔者的经验,nginx开启对JavaScript脚本的gzip压缩后,运行到IE6上时,经常会出现如下问题:

  1. 当页面存在多个iframe,并且这些iframe独立使用相同的JavaScript脚本时,可能会出现脚本不运行或者运行不正确的情况——这与IE6在请求JavaScript脚本时会共享资源有关;
  2. IE6上通过各种方式页面跳转时,若在响应数据头部设置了cache-control:no-cache;,也有可能导致脚本不运行或者运行出错——这与IE6处理缓存数据的方式有关;
  3. JavaScript脚本中汉字没有被正确编码导致解析失败,从而使脚本不运行或者运行不正确

针对现在IE6几乎“无人问津”的现状,笔者建议:当遇到客户端浏览器是IE6及更早版本时不开启gzip功能:

gzip_disable "MSIE [1-6]\.";

不过对第一条问题,有人提出:预加载多个iframe共用的脚本文件来避免。
预加载JavaScript脚本可以在页面中使用如下方式:

<!--[if IE 6.0]>
<script src="xxx.js" type="text/c"></script>
<![endif]-->

(text/c保证脚本加载但不运行,从而不会对客户端性能造成影响)

发布了195 篇原创文章 · 获赞 391 · 访问量 5万+

猜你喜欢

转载自blog.csdn.net/qq_43624878/article/details/103384583