Yahoo Yslow 团队提高 Web 性能的 14 条法则

Yahoo Yslow 团队提高 Web 性能的 14 条法则
　　01. Make Fewer HTTP Requests
　　　　减少少 HTTP 请求（整合多个分开的 CSS / JavaScript）

　　02. Use a Content Delivery Network
　　　　使用 CDN

　　03. Add an Expires Header
　　　　加入 Expires Header（过期时间标记头） 到 Image、CSS、JavaScript 档案里

　　04. Gzip Components
　　　　页面使用 gzip 压缩 HTML、JavaScript、StyleSheet、XML、JSON，但切记“不要压缩 Images，PDF 档案”

　　05. Put CSS at the Top
　　　　样式代码 css 置于页面顶部 head 标签中，使用 <LINK> 标签，不要使用 @import 语法。
　　　　避免样式改变引起的页面元素重绘。
　　　　link 是一个 html 标签，而 @import 是一个 css 标签，

　　06. Move Scripts to the Bottom
　　　　脚本语言 script 置于页面底部最下方 </body> 之前，所有在 JavaScript 加载以下的 HTML 在 JS 还没读完前，都不会显示画面。
　　　　把 JavaScript 的代码都放在 onload 执行。

　　07. Avoid CSS Expressions
　　　　避免使用 CSS expressions，可能这段 expression 会在每一次 mouse move、resize、scroll、key press 时执行，使用 js 来完成相应的功能。
　　　　 expression  是 CSS 中的行为，IE5 及其以后版本支持在 CSS 中使用 expression，用来把 CSS 属性和 Javascript 表达式关联起来，这里的 CSS 属性可以是元素固有的属性，也可以是自定义属性。就是说 CSS 属性后面可以是一段 Javascript 表达式，CSS 属性的值等于 Javascript 表达式计算的结果。
　　　　微软 IE 官方博客报道：IE8 标准模式下将不再支持 CSS 的 expression 功能。

　　08. Make JavaScript and CSS External
　　　　JS 跟 CSS 独立出文件比较好，首页除外。
　　　　使用 Post-onload download 技巧（download external files after onload）
window.onload = downloadComponents;
function downloadComponents() {
  var elem = document.createElement("script");
  elem.src = "http://.../file1.js";
  document.body.appendChild(elem);
  ...
}
在 Server-side 判断使用者 Browser 是否有设定 Cookie["hasPostOnloadDownload"]，
若没有，就使用 post-onload download 动态下载 CSS & JS；
若有用，就直接用 <script src="xxxx.js"></script>下载，Browser会抓取 Cache 的版本。

　　09. Reduce DNS Lookups
　　　　在一个页面中，不要使用过多地不同域名解析，建议不要超过 2 - 4 个，不然会降低页面载入速度。
　　　　开启 Keep-Alive 支援，在 pv 不是很高时可以加快客户访问的速度，因为不需要三次握手，pv > 120 万时就不要使用了，有可能导致服务器一直 TIME WAIT 而无响应。

　　10. Minify JavaScript
　　　　减小 Javascript。可以使用工具减少代码量，可以被浏览器更快的下载。
　　　　相关工具：
　　　　　　jsmin : http://crockford.com/javascript/jsmin
　　　　　　　　下载后更名成 jsmin.zip 解压缩出 jsmin.exe 即可执行：jsmin.exe < input.js > output.js（注意：所有 UTF-8 编码的 js 档会变成 ANSI as UTF-8 编码）
　　　　　　dojo compressor : http://dojotoolkit.org/docs/shrinksafe

　　11. Avoid Redirects
　　　　避免重定向：
　　　　　　网址若省略文件时，最后面一定要加上/结尾
　　　　　　追查 Log 档查看 Log Referer。

　　12. Remove Duplicate Scripts
　　　　移出代码中重复的脚本语言。

　　13. Configure ETags（Turn off ETags）
　　　　Etags 是 Web 服务器返回的实体的唯一标识，主要应用在有条件的 Get 请求中，如果 ETags 不匹配，就不能发送 304 码。
　　　　对于服务器之间一个单独的实体的 ETag 总是不同的，对于服务器多余一台机器的 Site，很少返回 304 状态码，所以多台前端服务器时要关闭 ETags 选项。
　　　　ETag format：
　　　　　　Apache: ETag: inode-size-timestamp
　　　　　　IIS: ETag: Filetimestamp:ChangeNumber

　　14. Make Ajax Cacheable
　　　　XHR、JSON、iframe、动态脚本 都是可以被缓存，精简和压缩的，这些不会经常变动的内容，可以缓存它，将最后修改时间标记在 URL 中。

提高 Web 性能的 14 条法则（详细版）
http://www.cnblogs.com/csharp/archive/2008/08/27/high_performance_web_sites_14_rules.html

CSS 中的行为——expression
http://www.blueidea.com/tech/site/2006/3705.asp

IE8 将不再支持 CSS 中的 expression
http://www.cnblogs.com/JustinYoung/archive/2008/10/17/ending-expressions.html

Dojo 的压缩
http://pigdogyourmother.ycool.com/post.1684294.html

提高基于 Dojo 的 Web 2.0 应用程序的性能
http://www.ibm.com/developerworks/cn/web/wa-lo-dojo-perf/

常见的 HTTP 状态代码及其原因
http://leeqianjun.javaeye.com/blog/266866

使用 ETags 减少 Web 应用带宽和负载
http://www.infoq.com/cn/articles/etags

http://liudaoru.javaeye.com/blog/211975