当前位置: 首页 > 图文教程 > 网页制作 > CSS样式表 > YUI Compressor压缩JavaScript的内容

CSS样式表
网页设计关于WEB标准的相关问题汇总
项目管理:交互-设计-制作三个角色的组合
学习CSS制作网页总结的一些经验
多个CSS样式表争夺特定选择符的控制权
网页设计制作CSS实现隔行换色两种方法
CSS教程:DIV底部放置文字
CSS教程:CSS命名参考
CSS教程:控制网页文件大小通过精简CSS实现
CSS教程:关于文字溢出问题的研究
符合web标准的嵌入Flash的方法
学习WEB标准必备的四项技能
CSS对表格单元格强制换行和不换行
CSS制作符合网站标准的细线表格
区分IE6,IE7和firefox的CSS hack
CSS教程:学习CSS的继承性
CSS教程:CSS兼容的技巧
CSS教程:浮动元素对浏览器的支持
闭合浮动元素让CSS代码更规范
深入分析网页CSS隐藏文字和以图换字技术
看懂《CSS hack浏览器兼容一览表》

CSS样式表 中的 YUI Compressor压缩JavaScript的内容


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-28   浏览: 132 ::
收藏到网摘: n/a

YUI Compressor 压缩 JavaScript 的内容包括:

  1. 移除注释
  2. 移除额外的空格
  3. 细微优化
  4. 标识符替换(Identifier Replacement)

YUI Compressor 包括哪些细微优化呢?

  • object["property"] ,如果属性名是合法的 JavaScript 标识符(注:合法的 JavaScript 标识符——由一个字母开头,其后选择性地加上一个或者多个字母、数字或下划线)且不是保留字,将优化为: object.property
  • {"property":123} ,如果属性名是合法的 JavaScript 标识符且不是保留字,将优化为 {property:123} (注:在对象字面量中,如果属性名是一个合法的 JavaScript 标识符且不是保留字,并不强制要求用引号引住属性名)。
  • 'abcd\'efgh',将优化为 "abcd'efgh"。
  • "abcd" + "efgh",如果是字符串相连接,将优化成 "abcdefgh"(注:所有在使用 YUI Compressor 的前提下,对于脚本中的字符串连接,使用连接符 “+” 的效率和可维护性最高)。

对于 JavaScript 最有效的压缩优化,当属标识符替换。

比如:

(function(){
    function add(num1, num2) {
        return num1 + num2;
    }
})();

进行属标识符替换后:

(function(){
    function A(C, B) {
        return C+ B;   
}
})();

再移除额外的空格,最终成了:

(function(){function A(C,B){return C+B;}})();

YUI Compressor 标识符替换仅替换函数名和变量名,那哪些不能被替代呢?

  1. 原始值:字符串、布尔值、数字、null 和 undefined。一般来说字符串占的空间最多,而非数字字面量其次(true、false,null,underfinded)。
  2. 全局变量:window、document、XMLHttpRequest等等。使用最多的就是 document、window。
  3. 属性名,比如:foo.bar。占据的空间仅次于字符串,”.” 操作符无法被代替,且 a.b.c 更加费空间。
  4. 关键字。经常被过度使用的关键字有:var、return。最好的优化方法:一个函数仅出现一次 var 和 return 关键字。

对于原始值、全局变量、属性名的优化处理方式大致相同:任何字面量值、全局变量或者属性名被使用超过 2 次(包括2次),都应该用局部变量存储代替。

但有部分情况下是禁止使用标识符替换的:

  1. 使用 eval() 函数。解决方法:不使用或者创建一个全局函数封装 eval()。
  2. 使用 with 语句。解决方法:方法同上。
  3. JScript 的条件注释。唯一解决的方法:不使用。

由于 YUI Compressor 是建立在 rhino interpreter 基础上的,所以上述所有的优化都是安全的。

扩展阅读:
《Extreme JavaScript Compression With YUI Compressor》