关于Web性能优化

[Yahoo前端优化十四条军规]

· 压缩源码与图片

JavaScript文件源文件可以采用混淆压缩方式，css文件源文件代码进行普通压缩，JPG图片可以根据具体质量来压缩为50%到70%，PNG可以使用一些开源软件来压缩，比如24色变成8色、去掉一些PNG格式信息等。

· 选择合适的图片格式

如果图片颜色数较多的就使用JPG格式，如果图片颜色数较少就使用PNG格式，如果能够通过服务器端判断浏览器支持的WebP，那么就使用WebP格式或者SVG格式。

· 合并静态资源

包括css、JavaScript和小图片，减少http请求

· 开启服务器端Gzip压缩

者对文本资源非常有效，对图片压缩则没有那么大的压缩比率。

· 使用CDN

或者一些公开库使用第三方提供的静态资源地址（比如：JQuery、normalize、css）一方面增加并发下载量，另一方面能够和其他网站共享缓存。

· 延长静态资源缓存时间

这样，频繁访问网站的访客就能够更快的访问。不过这里要通过修改文件名方式。确保在资源更新的时候，用户回来拉取到最新的内容。

· 把css放在页面的头部，把javascript放在页面底部

这样就不会阻塞页面渲染，让页面出现长时间的空白。

有关于Web性能优化这个词既可以解读成页面加载速度（Page Speed）的优化，也可以解读为页面渲染性能（Page Performance）的优化。