优化博客页面的访问速度

2020-02-20  

我的博客网站中,随着维护的面试题越来越多,虽然是通过 nginx 转发 html 静态文件,但是速度还是越来越慢。

分析了一下原因:

1、网络层面

  • 家里是中国移动的宽带,接收服务器的 html 耗时比较长,达到好几秒。
  • 电脑连接中国电信的手机热点,访问速度明显快很多。
  • 网络层面的优化,比较麻烦,暂不考虑。

2、减少文件传输大小

  • 打开浏览器的 network,看到传输的 html 文件达到 180 KB。把生成 html 的模版中的多余的空行和空格去除。
  • ngnix 开启 gzip 压缩。文件压缩到 20-40 KB,使用移动宽带,传输速度在 200-500 毫秒之间。

 

重点说一下 nginx 开启 gzip 压缩,效果还是挺明显

nginx 中 gzip 是基础模块,不需要重新编译。

开启参数如下:

# 开启和关闭 gzip 模式
gzip on|off;

# 文件大于 1k 才进行压缩
gzip_min_length 1k;

# gzip 压缩级别:1-9,数字越大压缩程度越大,也越占用CPU时间
gzip_comp_level 1;

# 进行压缩的文件类型
gzip_types text/plain application/javascript application/x-javascript text/css application/xml text/javascript ;

# nginx 对于静态文件的处理模块:开启后会寻找以 .gz 结尾的文件,不压缩直接返回,如果找不到则不进行压缩
gzip_static on|off

# 是否在 http header 中添加Vary: Accept-Encoding,建议开启
gzip_vary on;

# 设置压缩所需要的缓冲区大小,以 4k 为单位
gzip_buffers 2 4k;

# 设置 gzip 压缩针对的 HTTP 协议版本
gzip_http_version 1.1;

 

gzip 开启效果检测方法:

1、文件大小明显被压缩,访问速度变快

2、curl命令行curl -I -H"Accept-Encoding: gzip, deflate" "http://www.abc.com"

3、通过浏览器的控制台 network 看到的 http  请求 response headers 中 Content-Encoding:gzip

 

开启失败的处理办法:

1、检查 nginx 配置。如 gzip:on;gzip_types是否包含压缩的文件类型;gzip_static:on 开启找不到 .gz 文件

2、其他转发服务缓存了内容,请求未到达配置的 nginx

 

ConstXiong 备案号:苏ICP备16009629号-3