向Http头添加过期或者缓存控制(Add an Expires or a Cache-Control Header)
此规则规则主要包含如下两个方面
- 对于静态网页组件，通过设置足够长的Expires Header，来实现“永不过期“策略。
- 对于动态网页组件，通过设置恰当的Cache-Control Header，来帮助浏览器根据条件来判断是否做更新请求。
There are two things in this rule:
- For static components: implement “Never expire” policy by setting far future Expires header
- For dynamic components: use an appropriate Cache-Control header to help the browser with conditional requests
网络页面设计变得越来越丰富，同时也意味着页面包含越来越多的脚本，样式表，图片和Flash。第一次访问你网站的用户，不得不做多次Http请求，不过你可以通过设置Http的Expires Header让这些组件缓存在客户端，从而在接下来的页面浏览过程中，避免了不必要的Http请求。Expires Header最常用于图片，不过我们更应该将之用到所有的网页组件上：脚本，样式表，Flash等等。
Web page designs are getting richer and richer, which means more scripts, stylesheets, images, and Flash in the page. A first-time visitor to your page may have to make several HTTP requests, but by using the Expires header you make those components cacheable. This avoids unnecessary HTTP requests on subsequent page views. Expires headers are most often used with images, but they should be used on all components including scripts, stylesheets, and Flash components.
浏览器和代理服务器通过缓存来减少Http请求的数量和大小，从而更快的加载页面。服务器可以通过在Http response中设置Expires Header来告诉客户端组件应该缓存多长时间。下面是一个足够长的Expires Header，告诉浏览器，这个响应在2010年4月15号前都不过期。
Expires: Thu, 15 Apr 2010 20:00:00 GMT
Browsers (and proxies) use a cache to reduce the number and size of HTTP requests, making web pages load faster. A web server uses the Expires header in the HTTP response to tell the client how long a component can be cached. This is a far future Expires header, telling the browser that this response won’t be stale until April 15, 2010.
Expires: Thu, 15 Apr 2010 20:00:00 GMT
如果你用Apache作为服务器，就可以通过ExpiresDefault指令来设置相对于现在时间的一个过期日期。下面的例子就是通过ExpiresDefault指令将10年后的今天设置为过期时间的。
ExpiresDefault "access plus 10 years"
If your server is Apache, use the ExpiresDefault directive to set an expiration date relative to the current date. This example of the ExpiresDefault directive sets the Expires date 10 years out from the time of the request.
ExpiresDefault "access plus 10 years"
请记住，如果你已经用了一个相当长的Expires header，在你需要修改一个组件的时候，你一定要同时修改组件的文件名。在Yahoo内部，我们已经将这部分作为构建流程的一部分，具体做法就是为每一个组件设置一个版本号，比如yahoo_2.0.6.js。
Keep in mind, if you use a far future Expires header you have to change the component’s filename whenever the component changes. At Yahoo! we often make this step part of the build process: a version number is embedded in the component’s filename, for example, yahoo_2.0.6.js.
足够长的Expires header只会影响已经访问过你网站的那些用户。对那些第一次访问你网站或者已经清除了浏览器缓存的用户，并不能减少Http请求数。所以，此规则对性能的提高依赖于用户点击primed cache页面的频度(Primed Cache是指页面中已经包含了所有组件)。我们测量这条规则对Yahoo的影响，发现大约有75%-85%的页面已经有primed cache。通过设置足够长的Expires header，我们就可以提高缓存在用户浏览器的组件数量，从而在用户接下来的浏览中，不需要通过网络连接中发送一个字节的数据。
Using a far future Expires header affects page views only after a user has already visited your site. It has no effect on the number of HTTP requests when a user visits your site for the first time and the browser’s cache is empty. Therefore the impact of this performance improvement depends on how often users hit your pages with a primed cache. (A “primed cache” already contains all of the components in the page.) We measured this at Yahoo! and found the number of page views with a primed cache is 75-85%. By using a far future Expires header, you increase the number of components that are cached by the browser and re-used on subsequent page views without sending a single byte over the user’s Internet connection.