记录给自己的网站提速的方法有哪些-荐爱小站

最近给我自己的网站提速，像我这个破网站，随便优化优化，收益高得不得了。之前有说过我的服务器是学生价买的最低配的服务器，当前使用带宽： 1Mbps，这玩意随便几张图就急得不行。所以我网站在任何人电脑上第一次打开都得卡个十来秒来下图，辛辛苦苦做的动画啥都看不到，这可不行。

第一步：上传静态文件cdn

因为这些图片都是一些静态文件，是可以丢到 cdn 而不走自身服务器的，所以第一步就是在阿里云开了个 oss，把这些图片丢上去。过程很简单，找个最便宜的资源包，买它！再弄个 Bucket，新建个目录，上传图片。完事。这样一操作，图片加载速度一下就快了很多。

第二步：图片使用 Webp

但是图片依旧是 4、500k 的大小，太大了，是不是有别的更小的图片类型呢？

哈！Webp! 这个厉害了，同样的图，342k 的图压缩到了 57k，就这么定了！

第二步就是将全部静态图片都换成 webp 然后压缩一番再传到 oss 上，这样一来，我这个动画效果就能完美展示，再也不会出现少图的情况了！

但是！Webp 并不是所有浏览器都支持，特别是 Safari，从头到位没一点绿，这就很难受，Safari 上就是完全看不到这个动画了！

…这个…目前还没想到怎么解决，可能…全部换回png或者jpg吧…先不纠结这个了，还是看看网站哪里还能再加加速。

第三步：服务器使用 GZIP

GZIP!又是压缩！要加快就是要将同样的内容用更少的数据传给客户端。

加这个也很容易，在 nginx 的总配置的 http 里添加

gzip on;
gzip_min_length 1k;
gzip_buffers 4 16k;
gzip_comp_level 2;
gzip_static on;
gzip_types text/plain application/javascript text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png;
gzip_vary on;
gzip_disable "MSIE [1-6]\.";
# 每个属性都有对应的效果，可以去看看对应的文档。

配置好后重新启动一下 nginx 就好了。在看网站的对资源的请求，可以看到有 Content-Encoding: gzip 这么一条属性，这就说明 GZIP 配置成功了。

到目前，我的网站也就做了这三部来提高页面加载速度，不多，也不麻烦，但是效果很好（因为底子太差），其实很多正经项目都会有第一步和第三部的操作，可以说是基本操作，我在这只是作为一个初学者来学习这些东西。

其实之后还可以有第四步。

第四步：使用 http 2.0

目前我所见的网站大多都还是使用的 http 1.1，其实 http 2.0 老早就出了，http 2.0 相比 http 1.1/1.0 优化了好多好多，简单点说就是：多路复用，二进制分帧，首部压缩，服务端推送，更多可以参考这个。

以我目前的水平来看 http 2.0 能给我带来啥好的，我就是觉得多路复用挺好的。之前的 http 1.1/1.0协议中，浏览器客户端在同一时间，针对同一域名下的请求有一定数量限制。超过限制数目的请求会被阻塞。

对我的个人网站来说，欢迎页面有很多图片，但是图片不能同时请求，只能几个几个的分批请求，但是如果使用了 http 2.0 则没有这个限制。

但是 http 2.0 需要 https，这个其实也很简单，按着步骤来1、2、3 分分钟就好了。

以上就是我已经或者将要对网站加载速度做的优化操作，很简单，有的也很基础，但是对那种完全没做过优化的网站来说，这些操作带来的收益是非常非常高的，一定得做。

标签：网站优化

记录给自己的网站提速的方法有哪些