为什么想到写篇缓存网站优化?

都是逗比穷惹的祸,本人的vps内存比较小,而我自己又做了图片系统,博客的图片都是经过裁剪的,图片做裁剪可以非常占用内存了

为了降低vps的压力,就只能在前端做缓存优化了。http真是一个伟大的协议,我们就来通过http header 关键字来做网站优化

1)修改时间:Last-Modified  和 IF_MODIFIED_SINCE

   Last-Modified 关键字是用来设置文档的最后的更新日期,如下代码

  Last-Modified:Thu, 15 Oct 2015 13:47:06 GMT

 浏览器发现response header 有 Last-Modified 就会对资源缓存的,在下次请求同样的资源就会在request header 加 If-Modified-Since 并且值等于 Last-Modified 的 值,如下

If-Modified-Since:Thu, 15 Oct 2015 13:47:06 GMT

然后在php端就可以根据  $_SERVER['HTTP_IF_MODIFIED_SINCE']   和  资源的 修改时间 对比,如果没变,就直接可以返回 304 not found


2)过期时间: Expires 和 Cache-Control

虽然上面的方法,虽然会选择缓存进行渲染,但是还是多发送一次http请求了,虽然并没有响应实体,但是还是会造成资源消耗嘛(还是逗比穷惹的祸),Expires的设计思想 就和上面的方法不同

当服务端希望客户端对资源进行缓存时,为了避免客户端每次都来询问服务端:我上次的缓存还可以用吗?所以服务端选择放弃了,直接告诉客户端缓存多长时间了,在这段时间内可以直接时间,不要再来问我了。而服务端通过Expires告诉客户端浏览器可以缓存多长时间而不比去询问服务端了,如下代码

Expires: Sat, 04 Oct 2025 14:53:59 GMT
一看我就是狠家伙,缓存了10年了。当客户端浏览器发现有这个header就会缓存资源,在这个时间端内,浏览器都不会去询问服务器了。


但是Expires有个不足之处,如何服务器和客户端时间不一致,例如服务端让客户端缓存1个小时,而客户端时间比服务端时间快2个小时,等于就是缓存没效果了。这个时候就该
Cache-Control 属性出场了。如果客户端浏览器发现header中有改属性,就会通过本地客户端时间加上改属性值生成缓存时间,例如

Cache-Control: max-age=315360000
大家应该有个疑问,如果这Expires 和 Cache-Control两个属性同时有,以谁为主?

如果同时出现,Cache-Control优先


做完了上面两步,基本上我的图片都会被客户端缓存起来了,总算通过优化达到了我的目的!!