Nginx在处理网页请求时速度非常快,但是默认的Nginx配置也会导致PageSpeed评分降低。Google会将您网站的速度作为确定网站SEO位置的关键因素。
在本教程中,您将快速编辑nginx的配置文件,从而立即提升您网站的响应速度和PageSpeed指标。我们的目标是达到80/100以上的分数,这是PageSpeed分数绿色标记的阈值,其表示这是一个快速站点。
首先,本文将带您为特定类型的文件启用Gzip压缩。然后,将配置浏览器缓存以获得额外的提升。使用这些方法将提高在Nginx上运行的任何站点的运行速度,无论其构建的是CMS系统或者是个人博客。只要服务器是Nginx并且您可以编辑配置文件,即使你的服务器性能不够,这个方法也可行。
要完成本教程,您需要:
在我们进行更改之前,让我们查看现有的PageSpeed分数,这样我们就可以在教程完成后与性能基准进行比较。通过将网站网址粘贴到PageSpeedInsights服务并点击分析来完成此操作。
你会看到如下结果:
我们看到移动设备上的分数为63,桌面上的分数为74,因为其在服务器上未正确配置压缩和浏览器缓存。在本教程结束时,我们在在这个网站上检测下。
注意:在某些情况下,默认的Nginx配置可能已在配置文件中启用了Gzip压缩和缓存,从而产生了完美的PageSpeed分数。如果是这种情况,请继续阅读,因为默认设置不足以进行实际的应用。
CSS,JavaScript和图像文件可能很大,增加了用户网页下载的数据量。我们将使用压缩功能压缩这些数据,浏览器下载后会在本地解压,从而加快您的网站浏览速度。Nginx想压缩数据,可以选择Gzip工具。它适用所有的Linux发行版。启用Gzip压缩后,浏览器可以更快地下载静态资源,这就是PageSpeed工具(图中)将其标记为需要解决的问题的原因。
要启用压缩,请在nano或您喜欢的文本编辑器中打开站点的Nginx配置文件。我们将在此示例中使用默认文件:
sudo nano /etc/nginx/sites-available/default
找到服务器配置块,如下所示:
server {
listen 80 default_server;
listen [::]:80 default_server;
. . .
}
让我们添加代码段来配置压缩。
首先,启用Gzip压缩并设置压缩级别:
server {
listen 80 default_server;
listen [::]:80 default_server;
gzip on;
gzip_comp_level 5;
您可以选择1~9之间的数字。5是一个比较平衡的值,大多数ASCII文件减少了大约75%的容量。
接下来,告诉Nginx不要压缩任何已经很小并且不太可能进一步压缩的文件。默认值是20字节,其实这并不是一个比较好的默认值,因为它通常会在压缩后导致更大的文件。将它设置为256来代替:
gzip_comp_level 5;
gzip_min_length 256;
接下来,告诉Nginx压缩数据:
...
gzip_min_length 256;
gzip_proxied any;
这些代理在客户端的Accept-Encoding功能头变化时同时缓存资源的压缩版本和常规版本。这避免了一个问题,即非Gzip支持的客户端,如果他们的代理给他们压缩版本,那么极少数的客户端会显示乱码。
...
gzip_proxied any;
gzip_vary on;
最后,要为压缩的输出指定MIME类型。我们将压缩图像,JSON数据,字体和其他常见文件类型:
...
gzip_vary on;
gzip_types
application/atom+xml
application/javascript
application/json
application/ld+json
application/manifest+json
application/rss+xml
application/vnd.geo+json
application/vnd.ms-fontobject
application/x-font-ttf
application/x-web-app-manifest+json
application/xhtml+xml
application/xml
font/opentype
image/bmp
image/svg+xml
image/x-icon
text/cache-manifest
text/css
text/plain
text/vcard
text/vnd.rim.location.xloc
text/vtt
text/x-component
text/x-cross-domain-policy;
# text/html is always compressed by gzip module
编辑完成后,整个部分应如下所示:
server {
listen 80 default_server;
listen [::]:80 default_server;
gzip on;
gzip_comp_level 5;
gzip_min_length 256;
gzip_proxied any;
gzip_vary on;
gzip_types
application/atom+xml
application/javascript
application/json
application/ld+json
application/manifest+json
application/rss+xml
application/vnd.geo+json
application/vnd.ms-fontobject
application/x-font-ttf
application/x-web-app-manifest+json
application/xhtml+xml
application/xml
font/opentype
image/bmp
image/svg+xml
image/x-icon
text/cache-manifest
text/css
text/plain
text/vcard
text/vnd.rim.location.xloc
text/vtt
text/x-component
text/x-cross-domain-policy;
# text/html is always compressed by gzip module
}
保存并关闭文件。
要确保您的文件此时没有错误,请测试Nginx配置:
sudo nginx -t
如果您完全按照本教程中的说明进行了更改,则不会显示任何错误消息。
此更改将为您的站点提供最大的加速,但您也可以配置Nginx以利用浏览器缓存,这将从服务器中挤出额外的性能。
第一次访问域时,会下载一些文件并将其存储在浏览器的缓存中。在后续访问中,浏览器可以提供本地版本,而不是再次下载文件。这使得网页加载速度更快,因为它只需要检索自上次访问以来已更改的数据。为用户提供了更好的体验,也是PageSpeed数据判断因素之一。
在编辑器中打开默认的Nginx配置文件:
sudo nano /etc/nginx/sites-available/default
您将添加一小段代码,告诉浏览器将CSS,JavaScript,图像和PDF文件缓存时间,这里我们设置为七天。
在上一个Gzip压缩代码之后直接在服务器块中插入以下代码段:
...
# text/html is always compressed by gzip module
location ~* \.(jpg|jpeg|png|gif|ico|css|js|pdf)$ {
expires 7d;
}
注意:如果您运行的是一个简单的博客,那么每周强制进行新的下载是没有意义的。相反,您可以告诉浏览器将文件缓存更长时间,例如30天或更长时间。
最终的Nginx配置文件应如下所示:
server {
listen 80 default_server;
listen [::]:80 default_server;
gzip on;
gzip_comp_level 5;
gzip_min_length 256;
gzip_proxied any;
gzip_vary on;
gzip_types
application/atom+xml
application/javascript
application/json
application/ld+json
application/manifest+json
application/rss+xml
application/vnd.geo+json
application/vnd.ms-fontobject
application/x-font-ttf
application/x-web-app-manifest+json
application/xhtml+xml
application/xml
font/opentype
image/bmp
image/svg+xml
image/x-icon
text/cache-manifest
text/css
text/plain
text/vcard
text/vnd.rim.location.xloc
text/vtt
text/x-component
text/x-cross-domain-policy;
# text/html is always compressed by gzip module
location ~* \.(jpg|jpeg|png|gif|ico|css|js|pdf)$ {
expires 7d;
}
}
保存并关闭文件以退出。确保配置没有错误:
sudo nginx -t
然后重新启动Nginx。
sudo systemctl restart nginx
让我们看看这些变化如何影响我们的PageSpeed吧。
第四步、测试
我们再次打开PageSpeed Insights ,然后输入你的网址,点击“分析”您将看到压缩和浏览器缓存警告消失了:
完成本教程后,您的成绩应该比以前高出至少10分。我们的目标是得分高于80。如果您的网站仍低于此阈值,还有其他一些事项需要注意。请查看下方的优化建议,PageSpeed Insights将详细说明这些内容并向您展示如何修复它们。
本文教你通过对Nginx配置进行简单更改来加速您的网站。更改Nginx配置只是改进PageSpeed的一种方法。您仍然需要编写高性能代码,适当缓存内容,通过内容分发网络(CDN)优化,并尽可能使用压缩策略以保持快的访问速度。
参考文献:《How To Increase PageSpeed Score By Changing Your Nginx Configuration on Ubuntu 16.04》
原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。
如有侵权,请联系 cloudcommunity@tencent.com 删除。
原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。
如有侵权,请联系 cloudcommunity@tencent.com 删除。