四、优化及调试--网站优化--Yahoo军规中

8、避免使用CSS表达式（避免在CSS中使用Expressions）

　　什么是CSS表达式：是用来把CSS属性和JavaScript关联起来。

　　　　

　　页面显示和缩放，滚动、乃至移动鼠标时，CSS表达式的计算频率是我们要关注的。可以考虑一次性的表达式或者使用事件句柄来代替CSS表达式。

9、将CSS和JS放到外部文件中

　　

　　是不是见到JS和CSS都要单独提取呢？

　　　　

　　我们需要权衡内置代码带来的HTTP请求减少与通过使用外部文件进行缓存带来的好处的折中点。

10、减少DNS查找次数

　　 

　　  

　　我们需要权衡减少 DNS查找次数和保持较高程度并行下载两者之间的关系。

11、精简CSS和JS（压缩 JavaScript 和 CSS ）

　　方法：

　　

　　目的就是减少下载的文件体积，可考虑压缩工具JSMin和YUI Compressor。

　　

12、避免跳转（避免重定向）

　　什么是重定向：原始请求被重新转向到了其他请求。

　　

　　为什么要避免冲定向？

　　因为重定向增加了浏览器到服务器的访问次数，如下图所示：

　　　　　　

　　为了确保“后退”按钮可以正确地使用，使用标准的 3XXHTTP状态代码；同域中注意避免反斜杠 “/” 的跳转；
　　跨域使用 Alias或者 mod_rewirte建立 CNAME（保存一个域名和另外一个域名之间关系的DNS记录）

13、剔除重复的JS和CSS（移除重复的脚本）

　　重复调用脚本，除了增加额外的HTTP请求外，多次运算也会浪费时间。在IE和Firefox中不管脚本是否可缓存，它们都存在重复运算JavaScript的问题。

14、配置实体标签（ETag）

　　

　　Entity tags（ETags）（实体标签）是web服务器和浏览器用于判断浏览器缓存中的内容和服务器中的原始内容是否匹配的一种机制（“实体”就是所说的“内 容”，包括图片、脚本、样式表等），是比last-modified date更更加灵活的机制，单位时间内文件被修过多次，Etag可以综合Inode(文件的索引节点(inode)数)，MTime(修改时间)和 Size来精准的进行判断，避开UNIX记录MTime只能精确到秒的问题。 服务器集群使用，可取后两个参数。使用ETags减少Web应用带宽和负载。

15、使用AJAX缓存

　　

　　利用时间戳，更精巧的实现响应可缓存与服务器数据同步更新。

 

16、尽早刷新输出缓冲

　　尤其对于css，js文件的并行下载更有意义

17、使用GET来完成AJAX请求

　　当使用XMLHttpRequest时，浏览器中的POST方法是一个“两步走”的过程：首先发送文件头，然后才发送数据。在url小于2K时使用GET获取数据时更加有意义。

18、延迟加载

　　确定页面运行正常后，再加载脚本来实现如拖放和动画，或者是隐藏部分的内容以及折叠内容等。

19、预加载

　　关注下无条件加载，有条件加载和有预期的加载。

20、减少DOM元素个数

　　使用更适合或者在语意是更贴切的标签，要考虑大量DOM元素中循环的性能开销。