Nginx之使用gzip优化网站访问速度

超、凢脫俗 2022-05-16 11:20 257阅读 0赞

使用nginx对前端的css、js、image进行压缩，这个一个非常简单和常见的优化方式，对于这个相信很多人也在网上查过，通过向nginx添加如下配置来进行压缩

gzip  on;
    gzip_min_length 1k;
    gzip_buffers 4 16k;
    #gzip_http_version 1.0;
    gzip_comp_level 2;
    gzip_types text/plain application/x-javascript application/css  text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png;
    gzip_vary off;
    gzip_disable "MSIE [1-6]\.";

但是发现加了如下配置后，js，image并没有被压缩，其实是配置出了问题，问题在于**gzip\_types** 中的 **application/x-javascript**，需要把其中的X去掉

**分析下每行配置的意思：**

**gzip on：**开启Gzip

**gzip\_min\_length 1k：**不压缩临界值，大于1K的才压缩，一般不用改

\*\*gzip\_buffers 4 16k：\*\*buffer不用改

**gzip\_http\_version 1.0**：用了反向代理的话，末端通信是HTTP/1.0，有需求的应该也不用看我这科普文了；有这句的话注释了就行了，默认是HTTP/1.1

**gzip\_comp\_level 2：**压缩级别，1-10，数字越大压缩的越好，时间也越长

**gzip\_types：**进行压缩的文件类型，需要压缩什么就加什么就行了，JavaScript有两种写法，最好都写上吧，总有人抱怨js文件没有压缩，其实多写一种格式就行了

**gzip\_vary：** 跟Squid等缓存服务有关，on的话会在Header里增加”Vary: Accept-Encoding”

\*\*gzip\_disable：\*\*IE6对Gzip不怎么友好，不给它Gzip了

JavaScript的MIME类型通常为“application/x-javascript”, 非IE的浏览器认“application/javascript”,用“text/javscript”最通用，因为type可以不指定默认是”text/javascript”，**建议把application/javascript 和 text/javascript都加上**

配置成功后，重启Nginx，看到如下图所示就表示压缩成功了  
![70][]

压缩效果还是很明显的，我们对比下压缩前后js的大小  
压缩前：  
![70 1][]

压缩后：

![这里写图片描述][70 2]

原文地址：[https://somta.com.cn/\#/blog/view/2d671b22b400433ba4b070cffc95e6e7][https_somta.com.cn_blog_view_2d671b22b400433ba4b070cffc95e6e7]

本文由明天的地平线创作，如想了解更多更详细的内容，请关注一下公众号，公众号内将进行最新最实时的更新！  
![70 3][]

[70]: /images/20220516/bcc4c95b081a490d8d761e54be007888.png
[70 1]: /images/20220516/c17d067a4f6f4c1eaa17cefaf99bda06.png
[70 2]: /images/20220516/bd4c3eba643343ef84128c6bcc6eb9cb.png
[https_somta.com.cn_blog_view_2d671b22b400433ba4b070cffc95e6e7]: https://somta.com.cn/#/blog/view/2d671b22b400433ba4b070cffc95e6e7
[70 3]: /images/20220516/186ba4ae1d634e6fb116a457178d2cf8.png