移除注释和空白
注释的作用就不解释了,用户访问你的网站,把一个带注释的代码拿过去,而不会执行注释的这段东西,岂不是白白浪费了这段代码所带来的网络带宽。于是乎我们压缩就应该把注释给Del掉。
空白则是为了代码美观,易于程序员查看调试,对于解释器来说,空白是无意义的,反而得花时间去扫描它,所以压缩应该也要去除这些无意义的空白,包括缩进,空格,空行等。
做完这一步,只是第一层次的压缩。为了使得JS文件尽量的小,我们还得采用一些新思路。
优化代码
我们是不是经常使用"abcd"+"efgh"这样的字符串拼接呢?于是我们考虑在压缩的时候直接就压缩成"abcdefgh"这样对比一下,少了 两个双引号跟一个加号,如果使用字符串拼接比较频繁的话,这个优化会节省不少空间,并且提高了JS的执行效率(因为两个字符串拼接,解释器需要重新去申请 内存空间,然后把两端字符串复制进去)。
对象的属性访问是不是也很频繁呢?例如o["name"]等,又或者是定义了对象{"name":"Object"};这样的话我们可以优化一下就是变成o.name以及{name:"Object"}节省几个字符。
还有例如var a = new Array()优化成var a = []等(Object就是使用{}代替);连续的多个var定义可以用,来优化成一条语句定义。
同时也能适当的提高JS的执行性能!外语屋
千万不要小看这几个字节,往往一个大型应用有多少用户在下载你这个JS文件,累积起来这个数字就很庞大了。
变量替换
要进一步缩小文件大小的话,我们就要去分析一些JS的词法语法,替换变量。简单据个例子:
var myObj = 1;
myObj++;
myObj--;
alert(myObj);
变量替换的意思就是把原先的变量名换成更加短的变量名:
var A = 1;
A++;
A--;
alert(A);
自己比较一下就知道节省了多少个字节,并且代码被有效的保护起来了,谁知道你的A是什么含义,对吧?内陆运输
当然了,我记得好像有看过更加牛逼的替换,印象中是最后再将全部字符转化成16进制的\x的格式,有知道怎么做的同志告知一下。
undefined优化
在你的代码中是否经常出现 if (a != undefined)呢?很多包含undefined的语句,我们会看到这个单词很长很不爽,又不能直接把它替换成一个短一点的单词。于是后来看到了一种方法,在此之前我们先看看一个例子。
function f1(name){
alert(name);
}
f1();
我们可以发现调用f1时不带参数,f1的name参数将会是undefined值。好,于是我们对undefined进行优化跟缩短了。
举个例子,如果是下边这样的代码:
(function(name, undefined){//在这里undefined是一个变量!不信的话可以对此函数传入多一个值试试
/* 在这里就是我们的代码区域 */
if (name != undefined)
alert(name);
})('name');/* 有效参数为函数定义时的参数少一个以上,这样保证了第二个参数没有传入值,从而使其变成了undefined值 */
我们压缩的时候就会把所有的undefined替换成一个变量A,这样是不是缩短了很多字节呢?像Jquery等框架都做了这个优化,jQuery的源码的结构就是:
/*!
* jQuery JavaScript Library v1.6.2
* http://jquery.com/
*
* Copyright 2011, John Resig
* Dual licensed under the MIT or GPL Version 2 licenses.
* http://jquery.org/license
*
* Includes Sizzle.js
* http://sizzlejs.com/
* Copyright 2011, The Dojo Foundation
* Released under the MIT, BSD, and GPL Licenses.
*
* Date: Thu Jun 30 14:16:56 2011 -0400
*/
(function(window, undefined) {
/* jQuery Code */
window.jQuery = window.$ = jQuery;
})(window);