Javascript的压缩优化

移除注释和空白

注释的作用就不解释了,用户访问你的网站,把一个带注释的代码拿过去,而不会执行注释的这段东西,岂不是白白浪费了这段代码所带来的网络带宽。于是乎我们压缩就应该把注释给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);

posted @ 2011-08-09 10:26  sky7034  阅读(205)  评论(0编辑  收藏  举报
蘑菇街女装 货运专家