大家好，又见面了，我是你们的朋友全栈君。
第七条规则：避免CSS表达式的应用。个人对CSS表达式缺少应用，所以没有直接体会，但是大概的意思就是使用CSS表达式进行页面样式进行修改时，可能会造成表达式的多次重复性运行，导致执行效率的降低。例如，使用CSS表达式调用javascript函数对DOM进行动态操作。
第八条规则：使用外部Javascript和CSS。使用内联的Javascript和CSS文件确实可以提高文件的加载速度，应用减少了HTTP请求，不需求并行加载。但是，使用外部Javascript和CSS文件可以利用缓存，较少网络传输。目前使用大量JS进行逻辑处理的项目很多，外部的js和CSS文件也提高了代码的复用率。当然，书中还是给出了同时使用内联和外部两种文件同时加载的方式，就是使用DOM操作动态重接link和scrip节点，并下载CSS文件和js文件，书中帮这种方式称为加载后下载（Post-Onload Download），我个人也曾用这种方式实现过对js文件的动态模块化加载。
第九条规则：减少DNS查找。有网址转换为确定的IP会经过浏览器和操作系统中对DNS的缓存，通过设置DNS缓存的存活时间（Time-To-Live，TTL）、http的keep-alIve，可以减少DNS的查找，提高请求响应效率。同时，使用keep-alive会计算content-length，对于不便于计算content-length的场景，keep-alive可能需要关闭。
第十条规则：精简JS文件。这点区别于压缩组件（规则四）的地方就是删除文件中的无用代码（注释、空白），书中提交了JSmin的使用。与精简对应的是混淆（书中提到DOJO Compressor），混淆会对代码的变量等进行替换，也可以起到精简的效果，但效果并不明显。混淆还会加大工作量（部署、调试），所以书中建议只精简不混淆。上一篇文件中提到了YUI Compressor，更确切一下应该是一个对js和css进行精简和混淆的工具。
第十一条规则：避免重定向。 书中给出了重定向对性能损害的介绍，并给出了部分重定向使用场景的替代方案，影响比较深刻的是使用referer跟踪出站的信息。
第十二条规则：移除重复脚本。重复脚本会增加http请求。
第十三条规则：配置ETag。ETag是If-Modified-Since的增强（If-Modified-Since只能精确到秒），会在http头中增加If-None-Match信息。但是，当在集群环境下ETag会导致缓存失效，因此需要根据实际情况开始或关闭ETag。
第十四条规则：使Ajax可缓存。GET方式的Ajax请求是可以缓存的，所以是适当的开启Ajax请求缓存，以减少http请求。如Extjs中在reque方式中配置disableCaching : false，就可以缓存get方式的ajax请求。
第十五章中对多个网站的前端性能进行评测，介绍了YSlow工具，可以集成到firebug中，当然你也可以选择谷歌的PageSpeed。
除了以上四条规则，雅虎还有更丰富的前端优化规则。（这本书的作者也是雅虎的工程师。）
总结：个人觉得，压缩、精简、缓存这三个方面的应用对于自己中非专业的前端非常重要，也更便于实施，其中缓存尤其重要。使用缓存，需要理解http中相关的header、相应指令的含义、缓存过程中的逻辑处理过程、浏览器对缓存影响（如F5、CRTL+F5、地址栏回车、后退等）。
发布者：全栈程序员-站长，转载请注明出处：https://javaforall.net/129139.html原文链接：https://javaforall.net
