性能
- 提高性能最简单的办法就是减少HTTP的请求数量，每个HTTP请求除了有TCP开销外，还包含大量的头信息；
- 让页面和其资源文件保持较小的体积将减少网络用时，对于互联网上的应用而言，这才是真正的瓶颈；
- 将多个脚本文件合并成一个或是将多个CSS合并成一个样式表能减少HTTP连接数量；如果是后者的话确保文件可以被缓存；
- 使用CSS Sprites技术合并多张小图片，烫后使用background-image和background-position设置图片需要显示的尺寸和偏移量；
- 避免重定向也是减少HTTP请求数量的方法，URL结尾减少斜线是一个最常见的重定向场景；
浏览器如何加载资源
- 为了加速页面渲染，现代浏览器会并行下载所需的资源；但是，在所有样式表和脚本现在完成之前，页面是不会开始渲染的；
- 可以通过设置
defer属性来告诉浏览器脚本要在渲染页面之后执行;
<script src="foo.js" type="text/javascript" defer></script>
- 同时html5中还引入了
async属性，最适合在没有任何依赖的脚本中使用;
缓存
- 对于所有静态资源（脚本，样式表，图片等）都应该设置
Expires头，设置一个较远的实效日期； - 可以在引用资源文件的URL查询参数中添加修改事件，在资源更新后，清除原来的缓存并替换;
<link rel="stylesheet" href="master.css?1296085785" type="text/css"/>
- HTTP1.1引入Cache-Control弥补Expires缓存上的不足；
Cache-Control: max-age=3600, must-revalidate- max-age: 以秒为单位，制定资源的最大有效事件；和
Expires不同的是，该指令是相对于该请求的时间 - public: 标记资源是可被缓存的；默认情况下，通过SSL或使用HTTP认真后访问的资源，缓存是关闭的；
- no-store:完全关闭缓存，动态内容才会更多地使用这个选项；
- must-revalidate:告诉缓存它们必须遵守任何你给定地信息，并基于这些信息来判断资源地新旧程度；
- max-age: 以秒为单位，制定资源的最大有效事件；和
//简单设置
<meta http-equiv="Cache-control" content="public">
- 给提供服务地资源添加Last-Modified头信息也有助于缓存；
- 浏览器在对资源后续地请求中，就能制定If-Modified-Since头信息，这是一个时间戳。
- 如果该资源在最后一次访问之后未被修改，服务只返回304状态码（未修改）;
- 浏览器仍然可以请求，当服务器却不一定在响应中返回该资源地内容而节省网络时间；
源码压缩
包括脚本，样式表，html文件等； 脚本文件可以尝试YUI Compressor,它不仅会压缩脚本，还会替换变量
注意对带有中文地js文件，还需要做Unicode转码
Gzip压缩
- 在HTTP1.1开始支持；WEB客户端通过在发送请求时增加
Accept-Encoding头信息来标识自己支持地压缩方式
Accept-Encoding: gzip, deflate
- 如果服务器看到该头信息并且支持列出地压缩方式，它将会对响应结果进行压缩，并通过
Content-Encoding头信息标识其压缩方式;
Content-Encoding:gzip
- 然后浏览器才能正确地解码；一条不错地经验就是压缩任何文本类型地响应;
- 配置Gzip依赖于web服务器；
使用CDN
- CDN:内容发布网络为站点提供亭台资源内容服务以减少加载时间；
- CDN将你的那天部署在跨越多个地理位置地服务器上，故当用户发起一个请求时，可从就近地地服务器得到响应资源；
- google为很多开源地js库提供了免费的CDN服务;使用它的好处是用户很有可能已经缓存了该js文件;
加载CDN
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
上面的例子中没有指定请求协议，只用//;这样可以使得获取脚本文件时，可以使用和宿主页面一样的协议；