Nginx配置gzip加载优化

用户7741497

发布于 2022-03-05 06:30:16

46700

代码可运行

文章被收录于专栏：hml_知识记录hml_知识记录

运行总次数：0

代码可运行

提升首页加载速度，浏览器对于同于网站下，允许同时加载的资源个数是有限的，chrome为6个还是7个，如果打包体积过大就会影响加载速度影响后面资源的加载。因为我们环境上都是用的nginx因此我本地也是用的nginx做的测试，其他优化方法暂没有看。

实践：

本地能跑的项目，npm run build打包到dist目录
使用nginx代理，将代理指向远程的访问地址

gzip配置

我的配置文件主要部分：nginx.conf

http {
# gzip config
    # 开启gzip
    gzip on; 
    # 当返回内容大于1k时才会使用Gzip进行压缩
    gzip_min_length 1k; 
    # 设置压缩级别，级别越低压缩速度越快文件压缩比越小
    gzip_comp_level 9;
    # 压缩MIME头类型
    gzip_types text/plain application/javascript application/x-javascript text/css application/xml text/javascript application/x-httpd-php ;
    # 增加响应头Vary: Accept-Encoding
    gzip_vary on;
    # 通过表达式，表明哪些UA头不使用gzip压缩
    gzip_disable "MSIE [1-6]\.";
    server {
    # 本地代理的端口号
        listen       8081;
    # 本地代理的域名-可以随意
        server_name  localhost;
        #charset koi8-r;

        #access_log  logs/host.access.log  main;
    # 将所有的资源都代理到https://xxx.test.ztosys.com/这个地址上面
        location / {
      
            root  D:/workspace/ZTO/PG/ZTO-PGWeb/dist ;
            index  index.html index.htm;
            proxy_pass   https://xxx.test.ztosys.com/;
        }
    }
}