原文链接：https://developer.yahoo.com/performance/rules.html

1.减少HTTP请求
  （1）.合并文件（css,js,图片）
 （2-1）.CSS Sprites  ：将背景图像合并为单个图像，并使用CSS background-image和background-position属性来显示所需的图像片段（推荐）
（2-2）.图片映射：将多个图片组合成单个图片，通过坐标引用图片（不推荐）
（3）.内联图像：使用data:URL的方法将图像数据嵌入实际页面

2.使用CDN(内容分发网络) 
   https://my.oschina.net/fifadxj/blog/219702


3.添加an Expires 或者 a Cache-Control Header

 对于静态组件：通过设置远期Expires头来实现“永不过期”策略
 对于动态组件：使用适当的Cache-Control标头来帮助浏览器满足条件请求

  Expires头最常用于图片，但它们应该用于所有组件，包括脚本，样式表和Flash组件

4.Gzip组件缓存技术
  Gzip开启以后会将输出到用户浏览器的数据进行压缩的处理，这样就会减小通过网络传输的数据量，提高浏览的速度，提升用户体验。 

5.把 CSS 样式放在页面的顶部

6.将脚本放在底部( 包括内联的 )
  脚本引起的问题是它们阻止并行下载。加载脚本文件时，不会再加载其他的任何数据文件

7.避免使用CSS表达式
   CSS表达式是一种强大（和危险）的动态设置CSS属性的方法。它们在Internet Explorer中从版本5开始支持，但从IE8开始已弃用。作为示例，背景颜色可以设置为使用CSS表达式每小时交替：
    background-color：expression（（new Date（））。getHours（）％2？“＃B8D4FF”：“＃F08A00”）;

8.将 javascript 和 css 独立成外部文件

   在现实世界中使用外部文件通常会产生更快的页面，因为JavaScript和CSS文件由浏览器缓存。HTML文档中内联的JavaScript和CSS在每次请求HTML文档时都会下载。这会减少所需的HTTP请求数，但会增加HTML文档的大小。另一方面，如果JavaScript和CSS在由浏览器缓存的外部文件中，则减少HTML文档的大小而不增加HTTP请求的数量
 
9.减少DNS查询

10.压缩JavaScript和CSS文件

11.避免重定向

要记住的主要事情是重定向会减慢用户体验。在用户和HTML文档之间插入重定向会延迟页面中的所有内容，因为无法呈现页面中的任何内容，并且只有在HTML文档到达后才能开始下载组件。

最浪费的重定向之一频繁发生，Web开发人员通常不知道它。它发生在一个尾部斜线（/）从一个URL，否则应该有一个。例如，访问https://faxian.tuhu.cn/react/finddetail?id=69184会生成一个包含重定向到https://faxian.tuhu.cn/react/finddetail/?id=69184的301响应（注意添加的尾部斜杠）

12.删除重复的脚本

它损害性能，在一个页面中包含相同的JavaScript文件两次。两个主要因素增加了在单个网页中复制脚本的几率：团队规模和脚本数。当它发生时，重复的脚本通过创建不必要的HTTP请求和浪费JavaScript执行而损害性能。

13.配置 ETags
实体标记（ETags）是Web服务器和浏览器用来确定浏览器缓存中的组件是否与源服务器上的组件匹配的机制。（“实体”是另一个词“组件”：图像，脚本，样式表等）添加ETag以提供用于验证比上次修改日期更灵活的实体的机制。ETag是唯一标识组件的特定版本的字符串。唯一的格式约束是字符串引用。源服务器使用ETag响应头指定组件的ETag 

      HTTP/1.1 200 OK
      Last-Modified: Tue, 12 Dec 2006 03:03:59 GMT
      ETag: "10c24bc-4ab-457e1c1f"
      Content-Length: 12195

然后，如果浏览器必须验证组件，它使用If-None-Match头将ETag传回原始服务器。如果ETag匹配，则返回304状态码，对于该示例将响应减少12195字节

      GET /i/yahoo.gif HTTP/1.1
      Host: us.yimg.com
      If-Modified-Since: Tue, 12 Dec 2006 03:03:59 GMT
      If-None-Match: "10c24bc-4ab-457e1c1f"
      HTTP/1.1 304 Not Modified


14.缓存 Ajax 请求
为了提高性能，优化这些Ajax响应很重要。提高Ajax性能的最重要的方法是使响应可缓存，如添加到期或缓存控制头中所述。一些其他规则也适用于Ajax：
   Gzip组件
   减少DNS查找
   缩小JavaScript
   避免重定向
   配置ETag

15.尽早刷新缓存区
   当用户请求页面时，后端服务器可能需要200到500毫秒的时间来将HTML页面拼接在一起。在此期间，浏览器在等待数据到达时处于空闲状态。在PHP中，你有flush（）函数。它允许您将部分准备好的HTML响应发送到浏览器，以便浏览器可以开始提取组件，而后端正忙于其余的HTML页面。好处主要在繁忙的后端或光前端。

   一个好的地方考虑刷新是在HEAD之后，因为头的HTML通常更容易生产，它允许您包括任何CSS和JavaScript文件的浏览器开始并行抓取，而后端仍在处理。

16.对AJAX请求使用GET

在雅虎邮件研究小组发现，当使用XMLHttpRequest，POST在浏览器中实现为两个步骤：首先发送标题，然后发送数据。所以最好使用GET，它只需要一个TCP数据包发送（除非你有很多cookie）。IE中的最大URL长度为2K，因此如果您发送的数据超过2K，您可能无法使用GET。

17.延迟载入组件

18.预加载组件