通过gzip和nginx来提高网站打开速度

大标 2022年9月15日18:56:10网络推广评论0阅读模式

您应该知道,网站的打开速度取决于浏览器打开和下载的网页文件的大小。如果传输的页面内容文件数量减少,您的网站将打开得更快。特别是对于移动用户,打开网站的速度受到移动网络的限制,因此压缩网站页面的内容非常重要。

Gzip是一种非常流行的数据压缩方法。您可以在nginx配置中打开gzip来压缩web文件。然后,这些文件由浏览器解压缩,文件不会受到影响。但是,压缩文件会占用服务器资源,因此最好压缩这些文件以获得更好的效果。例如,文本文件的压缩效果非常好,通常会缩小两倍以上。然而,JPG或PNG文件已经被压缩,因此二次压缩的效果并不特别明显。

本文主要讨论如何配置nginx以启用gzip压缩。

环境

Ubuntu 20.04服务器

Root权限或具有sudo权限的非Root用户

1、 创建测试文件

在这一步中,我们将在默认的nginx目录中创建几个测试文件。稍后,我们将使用这些文件检查nginx的默认行为是否是gzip压缩,并测试配置更改是否具有预期效果。

首先,创建一些测试文件,主要用于查看gzip压缩效果。Gzip不分析文件内容。它主要根据文件扩展名来判断文件类型。如果它还分析文件内容,则总体效率将大大降低。所以我们可以创建一些图像文件、HTML文件和一些样式文件。

sudo truncate-s1k/var/www/html/test.html
sudo truncate-s1k/var/www/html/test.jpg
sudo truncate-s1k/var/www/html/test.css
sudo truncate-s1k/var/www/html/test.js

下一步是检查nginx在使用我们刚刚创建的文件在新安装中压缩请求文件时的行为。

2、 命令模式:查看压缩效果

使用curl命令添加头accept encoding:gzip以查看每个文件的压缩结果。

旋度-H;接受编码:gzip”-我http://localhost/test.html

您可以看到以下结果:

输出

HTTP/1.1200OK

服务器:nginx/1.18.0(Ubuntu)

日期:2021 2月9日星期二19:04:25 GMT

内容类型:文本/html

上次修改时间:2021 2月9日星期二19:03:41 GMT

连接:保持活力

ETag:W/&8221;6022dc8d-400;

内容编码:gzip

最后一行显示“内容编码:gzip"字样。这表明服务器正在发送gzip压缩的文件。默认情况下,nginx只压缩HTML文件。在这个命令中,您可以看到文件已被压缩。但是,其他文件格式不会被压缩。

您可以使用以下命令验证我们刚才所说的。

旋度-H;接受编码:gzip”-我http://localhost/test.jpg

再看一看结果,与之前的结果不同:

输出

HTTP/1.1200OK

服务器:nginx/1.18.0(Ubuntu)

日期:2021 2月9日星期二19:05:49 GMT

内容类型:图像/jpeg

内容长度:1024

上次修改时间:2021 2月9日星期二19:03:45 GMT

连接:保持活力

ETag:&8220;6022dc91-400;

接受范围:字节

输出结果中没有内容编码:gzip,这意味着文件尚未压缩。

您还可以使用此方法测试CSS和其他样式文件。

旋度-H;接受编码:gzip”-我http://localhost/test.css

结果是一样的:没有内容编码:gzip

输出

HTTP/1.1200OK

服务器:nginx/1.18.0(Ubuntu)

日期:2021 2月9日星期二19:06:04 GMT

内容类型:文本/css

内容长度:1024

上次修改时间:2021 2月9日星期二19:03:45 GMT

连接:保持活力

ETag:&8220;6022dc91-400;

接受范围:字节

3、 配置nginx以启用gzip功能

本节主要操作相关配置,以便gzip可以处理其他文件格式的压缩。

您可以使用nano或VIM编辑nginx的配置文件。

sudo nano/etc/nginx/nginx.conf

找到gzip设置部分,如下所示:

/等/nginx/nginx.conf

. . .
##
#“gzip"设置
#
#
gzip on;
gzip_禁用;msie6;;
#gzip_随时间变化;
#gzip_代理任何;
#gzip_ comp_ 6级;
#gzip_缓冲器16 8k;
#gzip_ http_版本1.1;
#gzip_类型文本/纯文本/css应用程序/json应用程序/x-javascript文本/xml应用程序/xml应用/xml+rss文本/javascript;
. . .

因为我们使用的是Ubuntu20.04,所以gzip在默认情况下是打开的。但是,一些设置无效,因此我们需要进行一些修改:

通过取消选择注释行之前的#来启用其他设置(即删除35符号)

加上gzip_ min_ length 256;参数,它告诉nginx不要压缩小于256字节的文件,因为小文件是不必要的。压缩这些文件将影响服务器的效率。

在gzip_中,将其他文件类型扩展名添加到类型参数。这些文件类型可以是web字体、图片、XML、JSON结构化数据或SVG图片文件。

应用这些更改后,设置部分应如下所示:

/等/nginx/nginx.conf

. . .
##
#“gzip"设置
#
#
gzip on;
gzip_禁用;msie6;;
gzip_随时间变化;
gzip_代理任何;
gzip_ comp_ 6级;
gzip_缓冲器16 8k;
gzip_ http_版本1.1;
gzip_ min_长度256;
gzip_类型
application/atom+xml
应用程序/geo+json
应用程序/javascript
应用程序/x-javascript
应用程序/json
应用程序/ld+json
应用程序/清单+json
应用/rdf+xml
应用/rss+xml
应用/xhtml+xml
application/xml
字体/eot
字体/otf
字体/ttf
图像/svg+xml
文本/css
文本/javascript
文本/普通
text/xml;
. . .

保存并关闭文件以退出。要启用新配置,您需要重新启动nginx:

sudo systemctl重启nginx

4、 确保所有配置正确

重复前面的测试步骤并执行相应的命令请求:

旋度-H;接受编码:gzip”-我http://localhost/test.html

由于HTML文件在默认情况下已被压缩,因此此命令的执行结果保持不变:

输出

HTTP/1.1200OK

服务器:nginx/1.18.0(Ubuntu)

日期:2021 2月9日星期二19:04:25 GMT

内容类型:文本/html

上次修改时间:2021 2月9日星期二19:03:41 GMT

连接:保持活力

ETag:W/&8221;6022dc8d-400;

内容编码:gzip

然后,让我们测试未压缩的CSS样式表,看看结果会有什么变化:

旋度-H;接受编码:gzip”-我http://localhost/test.css

您可以看到gzip正在压缩文件:

输出

HTTP/1.1200OK

服务器:nginx/1.18.0(Ubuntu)

日期:2021 2月9日星期二19:21:54 GMT

内容类型:文本/css

上次修改时间:2021 2月9日星期二19:03:45 GMT

连接:保持活力

改变:接受编码

ETag:W/&8221;6022dc91-400;

内容编码:gzip

我们可以用相同的方式测试JPG文件:

旋度-H;接受编码:gzip”-我http://localhost/test.jpg

我没有看到gzip压缩:

输出

HTTP/1.1200OK

服务器:nginx/1.18.0(Ubuntu)

日期:2021 2月9日星期二19:25:40 GMT

内容类型:图像/jpeg

内容长度:1024

上次修改时间:2021 2月9日星期二19:03:45 GMT

连接:保持活力

ETag:&8220;6022dc91-400;

接受范围:字节

因为在之前的配置中,我们没有添加图像/jpeg。

在本例中,我们已经成功地在nginx中配置了gzip。

结论

可以看出,gzip易于配置,速度的提高也非常明显。搜索引擎也喜欢这种加载方法。如果你想提高搜索引擎的排名,增加gzip是非常必要的。

weinxin
我的微信
微信扫一扫
大标
  • 本文由 发表于 2022年9月15日18:56:10
  • 转载请务必保留本文链接:https://www.tanhuibiao.com/3551.html
匿名

发表评论

匿名网友 填写信息

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: