精华内容
下载资源
问答
  • JS压缩数据 和解压

    千次阅读 2019-04-29 15:26:41
    var LZString = function() { function f(h, e) { if (!b[h]) { b[h] = {}; for (var i = 0; i < h.length; i++) { b[h][h.charAt(i)] = i } ...
    var LZString = function() {
        function f(h, e) {
            if (!b[h]) {
                b[h] = {};
                for (var i = 0; i < h.length; i++) {
                    b[h][h.charAt(i)] = i
                }
            }
            return b[h][e]
        }
    
        var c = String.fromCharCode,
            g = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=",
            d = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+-$",
            b = {},
            a = {
                compressToBase64: function(h) {
                    if (null == h) {
                        return ""
                    }
                    var e = a._compress(h, 6,
                        function(i) {
                            return g.charAt(i)
                        });
                    switch (e.length % 4) {
                        default:
                        case 0:
                            return e;
                        case 1:
                            return e + "===";
                        case 2:
                            return e + "==";
                        case 3:
                            return e + "="
                    }
                },
                decompressFromBase64: function(e) {
                    return null == e ? "": "" == e ? null: a._decompress(e.length, 32,
                        function(h) {
                            return f(g, e.charAt(h))
                        })
                },
                compressToUTF16: function(e) {
                    return null == e ? "": a._compress(e, 15,
                        function(h) {
                            return c(h + 32)
                        }) + " "
                },
                decompressFromUTF16: function(e) {
                    return null == e ? "": "" == e ? null: a._decompress(e.length, 16384,
                        function(h) {
                            return e.charCodeAt(h) - 32
                        })
                },
                compressToUint8Array: function(l) {
                    for (var j = a.compress(l), m = new Uint8Array(2 * j.length), k = 0, h = j.length; h > k; k++) {
                        var i = j.charCodeAt(k);
                        m[2 * k] = i >>> 8,
                            m[2 * k + 1] = i % 256
                    }
                    return m
                },
                decompressFromUint8Array: function(k) {
                    if (null === k || void 0 === k) {
                        return a.decompress(k)
                    }
                    for (var l = new Array(k.length / 2), j = 0, h = l.length; h > j; j++) {
                        l[j] = 256 * k[2 * j] + k[2 * j + 1]
                    }
                    var i = [];
                    return l.forEach(function(e) {
                        i.push(c(e))
                    }),
                        a.decompress(i.join(""))
                },
                compressToEncodedURIComponent: function(e) {
                    return null == e ? "": a._compress(e, 6,
                        function(h) {
                            return d.charAt(h)
                        })
                },
                decompressFromEncodedURIComponent: function(e) {
                    return null == e ? "": "" == e ? null: (e = e.replace(/ /g, "+"), a._decompress(e.length, 32,
                        function(h) {
                            return f(d, e.charAt(h))
                        }))
                },
                compress: function(e) {
                    return a._compress(e, 16,
                        function(h) {
                            return c(h)
                        })
                },
                _compress: function(q, j, w) {
                    if (null == q) {
                        return ""
                    }
                    var C, I, z, J = {},
                        k = {},
                        H = "",
                        E = "",
                        F = "",
                        y = 2,
                        B = 3,
                        A = 2,
                        D = [],
                        x = 0,
                        G = 0;
                    for (z = 0; z < q.length; z += 1) {
                        if (H = q.charAt(z), Object.prototype.hasOwnProperty.call(J, H) || (J[H] = B++, k[H] = !0), E = F + H, Object.prototype.hasOwnProperty.call(J, E)) {
                            F = E
                        } else {
                            if (Object.prototype.hasOwnProperty.call(k, F)) {
                                if (F.charCodeAt(0) < 256) {
                                    for (C = 0; A > C; C++) {
                                        x <<= 1,
                                            G == j - 1 ? (G = 0, D.push(w(x)), x = 0) : G++
                                    }
                                    for (I = F.charCodeAt(0), C = 0; 8 > C; C++) {
                                        x = x << 1 | 1 & I,
                                            G == j - 1 ? (G = 0, D.push(w(x)), x = 0) : G++,
                                            I >>= 1
                                    }
                                } else {
                                    for (I = 1, C = 0; A > C; C++) {
                                        x = x << 1 | I,
                                            G == j - 1 ? (G = 0, D.push(w(x)), x = 0) : G++,
                                            I = 0
                                    }
                                    for (I = F.charCodeAt(0), C = 0; 16 > C; C++) {
                                        x = x << 1 | 1 & I,
                                            G == j - 1 ? (G = 0, D.push(w(x)), x = 0) : G++,
                                            I >>= 1
                                    }
                                }
                                y--,
                                0 == y && (y = Math.pow(2, A), A++),
                                    delete k[F]
                            } else {
                                for (I = J[F], C = 0; A > C; C++) {
                                    x = x << 1 | 1 & I,
                                        G == j - 1 ? (G = 0, D.push(w(x)), x = 0) : G++,
                                        I >>= 1
                                }
                            }
                            y--,
                            0 == y && (y = Math.pow(2, A), A++),
                                J[E] = B++,
                                F = String(H)
                        }
                    }
                    if ("" !== F) {
                        if (Object.prototype.hasOwnProperty.call(k, F)) {
                            if (F.charCodeAt(0) < 256) {
                                for (C = 0; A > C; C++) {
                                    x <<= 1,
                                        G == j - 1 ? (G = 0, D.push(w(x)), x = 0) : G++
                                }
                                for (I = F.charCodeAt(0), C = 0; 8 > C; C++) {
                                    x = x << 1 | 1 & I,
                                        G == j - 1 ? (G = 0, D.push(w(x)), x = 0) : G++,
                                        I >>= 1
                                }
                            } else {
                                for (I = 1, C = 0; A > C; C++) {
                                    x = x << 1 | I,
                                        G == j - 1 ? (G = 0, D.push(w(x)), x = 0) : G++,
                                        I = 0
                                }
                                for (I = F.charCodeAt(0), C = 0; 16 > C; C++) {
                                    x = x << 1 | 1 & I,
                                        G == j - 1 ? (G = 0, D.push(w(x)), x = 0) : G++,
                                        I >>= 1
                                }
                            }
                            y--,
                            0 == y && (y = Math.pow(2, A), A++),
                                delete k[F]
                        } else {
                            for (I = J[F], C = 0; A > C; C++) {
                                x = x << 1 | 1 & I,
                                    G == j - 1 ? (G = 0, D.push(w(x)), x = 0) : G++,
                                    I >>= 1
                            }
                        }
                        y--,
                        0 == y && (y = Math.pow(2, A), A++)
                    }
                    for (I = 2, C = 0; A > C; C++) {
                        x = x << 1 | 1 & I,
                            G == j - 1 ? (G = 0, D.push(w(x)), x = 0) : G++,
                            I >>= 1
                    }
                    for (;;) {
                        if (x <<= 1, G == j - 1) {
                            D.push(w(x));
                            break
                        }
                        G++
                    }
                    return D.join("")
                },
                decompress: function(e) {
                    return null == e ? "": "" == e ? null: a._decompress(e.length, 32768,
                        function(h) {
                            return e.charCodeAt(h)
                        })
                },
                _decompress: function(B, C, I) {
                    var r, F, x, z, q, K, L, E, H = [],
                        G = 4,
                        J = 4,
                        D = 3,
                        k = "",
                        j = [],
                        y = {
                            val: I(0),
                            position: C,
                            index: 1
                        };
                    for (F = 0; 3 > F; F += 1) {
                        H[F] = F
                    }
                    for (z = 0, K = Math.pow(2, 2), L = 1; L != K;) {
                        q = y.val & y.position,
                            y.position >>= 1,
                        0 == y.position && (y.position = C, y.val = I(y.index++)),
                            z |= (q > 0 ? 1 : 0) * L,
                            L <<= 1
                    }
                    switch (r = z) {
                        case 0:
                            for (z = 0, K = Math.pow(2, 8), L = 1; L != K;) {
                                q = y.val & y.position,
                                    y.position >>= 1,
                                0 == y.position && (y.position = C, y.val = I(y.index++)),
                                    z |= (q > 0 ? 1 : 0) * L,
                                    L <<= 1
                            }
                            E = c(z);
                            break;
                        case 1:
                            for (z = 0, K = Math.pow(2, 16), L = 1; L != K;) {
                                q = y.val & y.position,
                                    y.position >>= 1,
                                0 == y.position && (y.position = C, y.val = I(y.index++)),
                                    z |= (q > 0 ? 1 : 0) * L,
                                    L <<= 1
                            }
                            E = c(z);
                            break;
                        case 2:
                            return ""
                    }
                    for (H[3] = E, x = E, j.push(E);;) {
                        if (y.index > B) {
                            return ""
                        }
                        for (z = 0, K = Math.pow(2, D), L = 1; L != K;) {
                            q = y.val & y.position,
                                y.position >>= 1,
                            0 == y.position && (y.position = C, y.val = I(y.index++)),
                                z |= (q > 0 ? 1 : 0) * L,
                                L <<= 1
                        }
                        switch (E = z) {
                            case 0:
                                for (z = 0, K = Math.pow(2, 8), L = 1; L != K;) {
                                    q = y.val & y.position,
                                        y.position >>= 1,
                                    0 == y.position && (y.position = C, y.val = I(y.index++)),
                                        z |= (q > 0 ? 1 : 0) * L,
                                        L <<= 1
                                }
                                H[J++] = c(z),
                                    E = J - 1,
                                    G--;
                                break;
                            case 1:
                                for (z = 0, K = Math.pow(2, 16), L = 1; L != K;) {
                                    q = y.val & y.position,
                                        y.position >>= 1,
                                    0 == y.position && (y.position = C, y.val = I(y.index++)),
                                        z |= (q > 0 ? 1 : 0) * L,
                                        L <<= 1
                                }
                                H[J++] = c(z),
                                    E = J - 1,
                                    G--;
                                break;
                            case 2:
                                return j.join("")
                        }
                        if (0 == G && (G = Math.pow(2, D), D++), H[E]) {
                            k = H[E]
                        } else {
                            if (E !== J) {
                                return null
                            }
                            k = x + x.charAt(0)
                        }
                        j.push(k),
                            H[J++] = x + k.charAt(0),
                            G--,
                            x = k,
                        0 == G && (G = Math.pow(2, D), D++)
                    }
                }
            };
        return a
    } ();
    var reqData = "123aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa"
    
    console.log("压缩",LZString.compressToEncodedURIComponent(reqData)) //压缩
    
    console.log("解压",LZString.decompressFromEncodedURIComponent("IwJgzAhl07fwx0g"))//解压
    
    module.exports = LZString

     

    展开全文
  • Javascript压缩(Js压缩)

    2009-07-11 17:24:10
    转载,只作为技术资料收藏: ---------------------------------------------------------------------- ...开发Ajax除了自己要写js代码外,同样也免不了要使用其它第三方js库,是否该为JavaScript减肥? 当...
    转载,只作为技术资料收藏:
    
    ----------------------------------------------------------------------
    怎么压缩Js?为什么要压缩Javascript? Javascript compressed/crunched
    开发Ajax除了自己要写js代码外,同样也免不了要使用其它第三方js库,是否该为JavaScript减肥?
    当你提高了用户体验,做出了很绚丽的效果而欣喜的时候,是否想过优化一下JS的效率,比如微软的live,其中的js做了压缩处理。JS的速度分为两种,JS下载速度和Js执行速度。

    今天就先来说说JS下载速度。要想js的下载速度快,就需要尽量减小js文件的大小。

    两种Js压缩工具(Javascript压缩工具)

    Javascript compressed - YUI Compressor

    According to Yahoo!'s Exceptional Performance Team, 40% to 60% of Yahoo!'s users have an empty cache experience and about 20% of all page views are done with an empty cache。

    The goal of JavaScript and CSS minification is always to preserve the operational qualities of the code while reducing its overall byte footprint (both in raw terms and after gzipping, as most JavaScript and CSS served from production web servers is gzipped as part of the HTTP protocol). The YUI Compressor is JavaScript minifier designed to be 100% safe and yield a higher compression ratio than most other tools. Tests on the YUI Library have shown savings of over 20% compared to JSMin (becoming 10% after HTTP compression). Starting with version 2.0, the YUI Compressor is also able to compress CSS files by using a port of Isaac Schlueter's regular-expression-based CSS minifier。

    http://developer.yahoo.com/yui/compressor/

    Download the YUI Compressor.
    http://www.julienlecomte.net/yuicompressor/

    YUI Compressor最新版本下载 - YUI Compressor 2.4.1下载地址:
    http://www.julienlecomte.net/yuicompressor/yuicompressor-2.4.1.zip

    JS和CSS压缩工具图形界面版本下载地址
    淘宝团队对YUICompressor做了层简单的封装,称之为TBCompressor.

    http://lifesinger.org/blog/wp-content/uploads/2008/10/TBCompressor_v2.4.zip

    淘宝是怎么压缩js和css的,淘宝使用的就是YUI Compressor
    目前Jquery从1.3版本开始也使用YUICompressor


    引用
    The YUI Compressor is a JavaScript compressor which, in addition to removing comments and white-spaces, obfuscates local variables using the smallest possible variable name. This obfuscation is safe, even when using constructs such as ‘eval’ or ‘with’ (although the compression is not optimal is those cases) Compared to jsmin, the average savings is around 20%.
    The YUI Compressor is also able to safely compress CSS files. The decision on which compressor is being used is made on the file extension (js or css)


    Javascript compressed - ESC Introduction

    这里我们可以使用一个工具ESC(ECMAScript cruncher)来帮我们完成这个工作,不过这个工具只能在Windows下使用。到http://www.saltstorm.net/depo/esc/introduction.wbm?pod=js下载ESC.zip,解压后看看它的帮助文档。很简单。

    ESC is an ECMAScript pre-processor written in JScript, enabling an unlimited number of external scripts to be compressed/crunched into supertight, bandwidth-optimized packages. Featuring several compression-techniques such as comment removal, whitespace stripping, newline stripping and variable substitution ESC can reduce the overall size of your code with up to ~45%. Single, multiple scripts and even directories with scripts can be merged together at the compression level you decide. The processed output can later be appended or written to a file, or piped to another application for further processing via STDOUT.

    ESC do NOT support crunching of inline scripts. So any attempt passing HTML, ASP, JSP, PHP or other equivalent documents to ESC is done at your own risk.

    ESC supports four levels of compression, where a higher level equals higher compression. Beware though that levels >2 requires your code to be syntaxically perfect or ESC will punish you by producing a broken and useless output.

    The compression ratio should hit around 25% using the default compression level on a vanilla looking script, but results as high as ~45% can be achieved depending on the script's design / your style of writing code.

    压缩级别分为5种,从0到4

    Level 0 :: No compression

    Level 1 :: Comment removal

    Level 2 :: Whitespace removal

    Level 3 :: Newline removal

    Level 4 :: Variable substitution

    在WINDOWS命令行下执行

    cscript ESC.wsf -ow menu2.js menu.js将会把menu.js按照js压缩级别2来压缩(默认js压缩级别为2)为menu2.js

    cscript ESC.wsf -l 3 -ow menu3.js menu.js将会把menu.js按照js压缩级别3来压缩为menu3.js

    需要注意的是,js压缩级别4会把变量名修改,如果你的js中用到了全局变量或者类的话,就不能使用该压缩级别了,否则其它使用你的js的文件可能会无法正常运行。

    试了一下,把yui的menu.js压缩了一下,对应的级别和压缩率分别如下:

    js压缩级别1:压缩率44.41%

    js压缩级别2:压缩率62.82%

    js压缩级别1:压缩率64.93%

    原来130多K的js文件压缩后也就40多K,看来还是挺有用处的。


    另外还有一个小工具jsmin也可以压缩,不过没有ESC的level选项,看了一下好像压缩效果类似于ESC的level3.济南大学的一些老师写了个jsmin的图形界面程序JsMinGUI,使用起来更加方便。:-)

    Dojo项目组也提供了一个工具,shrinksafe可以通过http://alex.dojotoolkit.org/shrinksafe/在线的上传要压缩的文件,处理完毕后可以保存到本地,另外shrinksafe还提供了一个本地运行的版本,需要jre1.4的支持。

    Ps:对于一些压缩的代码,在阅读时可以用JavaScript Code Improver来进行格式化。看看它主页上的一个例子:
    javascript压缩代码示例
    原来的代码:


    <script language="JavaScript">var i=0,s="",k=0;function foo(){for(j=0;j<10;j++){for(i=0;i<10;i++){s="string1";k=Math.floor(Math.random()*10);}for(i=20;i>9;i--){s="string2";k=I;}}}</script>


    格式化后:

    <script language="JavaScript">
    var I = 0, s = "", k = 0;
    function foo()
    {
    for(j = 0; j < 10; j++)
    {
    for(I = 0; I < 10; i++)
    {
    s = "string1";
    k = Math.floor( Math.random()*10 );
    }
    for(I = 20; I > 9; i--)
    {
    s = "string2";
    k = I;
    }
    }
    }
    </script>


    js压缩,巨NB的dHTML特效. 来自:
    http://hometown.aol.de/_ht_a/memtronic/MemTronic_CruncherCompressor_v09g.html

    JS压缩示例样本:JS压缩示例样本


    更多的JS压缩器以及混淆器

    In terms of code minification, the most widely used tools to minify JavaScript code are Douglas Crockford's JSMIN, the Dojo compressor and Dean Edwards' Packer:

    Douglas Crockford's JSMIN
    http://crockford.com/javascript/jsmin

    the Dojo compressor
    http://dojotoolkit.org/docs/shrinksafe

    Dean Edwards' Packer
    http://dean.edwards.name/download/

    http://dean.edwards.name/packer/ 在线Js压缩
    A Online JavaScript Compressor/Obfuscator version 2.0.2
    Also available as a .NET application
    开源下载:http://dean.edwards.name/download/#packer
    JS压缩器帮助:http://dean.edwards.name/packer/usage/
    http://dean.edwards.name/packer/usage/sample.html

    http://hometown.aol.de/_ht_a/memtronic/

    JavaScript Compressor/Obfuscator Demo:
    http://www.brainjar.com/js/crunch/demo.html

    JavaScript Code Improver:
    JavaScript Code Improver Download


    前面提到的Javascript压缩,都是采用删除注释,删除多余空格,替换字符等方式进行的,还有一种通过服务器的配置来实现Js静态压缩的方法:
    关于JavaScript的gzip静态压缩方法
    传统的JS压缩(删除注释,删除多余空格等)提供的压缩率有时还是不尽不意,幸亏现在的浏览器都支持压缩传输(通过设置http header的Content-Encoding=gzip),可以通过服务器的配置(如apache)为你的js提供压缩传输,或是appfuse中使用的GZipFilter使tomcat也提供这种能力

    现在的问题是这种动态的压缩会导致服务器CPU占用率过高,现在我想到的解决辨法是通过提供静态压缩(就是将js预先通过gzip.exe压缩好)

    一.下面描述在tomcat中的应用

    1.将prototype.js通过gzip.exe压缩保存成prototype.gzjs
    2.设置header,我编写了一个简单的AddHeadersFilter来将所有以gzjs结尾的文件增加设置header Content-Encoding=gzip
    web.xml中的配置

    <filter>
    <filter-name>AddHeaderFilter</filter-name>
    <filter-class>
    badqiu.web.filter.AddHeaderFilter
    </filter-class>
    <init-param>
    <param-name>headers</param-name>
    <param-value>Content-Encoding=gzip</param-value>
    </init-param>
    </filter>

    <filter-mapping>
    <filter-name>AddHeaderFilter</filter-name>
    <url-pattern>*.gzjs</url-pattern>
    </filter-mapping>


    测试prototype.js是否正常的代码

    <html>
    <head>
    <!-- type="text/javascript"不可少,有的浏览器缺少这个不能运行 -->
    <script src="prototype.gzjs" type="text/javascript"></script>
    </head>
    <body >
    <input id="username" name="username" value="badqiu"/><br />
    <input id="email" value="badqiu@gmail.com"/>
    <script>
    <!-- 测试prototype的方法是否正常-->
    alert($F('username'))
    </script>
    </body>
    </html>


    在Apache httpd中可以直接通过在httpd.conf增加AddEncoding x-gzip .gzjs来映射.gzjs文件的header

    二.相关压缩率数据
    1. prototype.js 1.5.0_rc0原始大小56KB,未经任何处理直接使用gzip压缩为12KB,总压缩率79%
    2. 通过js压缩工具压缩过的protytype.js为20KB,使用gzip压缩为10KB,总压缩率为83%
    3. 实际项目中的多个js合并成的文件 439KB,直接通过gzip压缩为85KB,总压缩率81%
    4. 439KB经过js压缩为165KB,再经过gzip压缩为65KB,总压缩率86%

    基本上你都可以忽略js压缩工具的压缩率,直接使用gzip压缩

    gzip下载地址 http://www.gzip.org
    tomcat的压缩配置示例下载地址: http://www.blogjava.net/Files/badqiu/gziptest.rar

    其主要是利用服务器自带的动态压缩功能 传输时压缩数据流.
    展开全文
  • Javascript压缩(Js压缩)工具聚合(www.ad0.cn 整理)怎么压缩Js?为什么要压缩Javascript? Javascript compressed/crunched开发Ajax除了自己要写js代码外,同样也免不了要使用其它第三方js库,是否该为JavaScript减肥...

    Javascript压缩(Js压缩)工具聚合(www.ad0.cn 整理)
    怎么压缩Js?为什么要压缩Javascript? Javascript compressed/crunched
    开发Ajax除了自己要写js代码外,同样也免不了要使用其它第三方js库,是否该为JavaScript减肥?
    当你提高了用户体验,做出了很绚丽的效果而欣喜的时候,是否想过优化一下JS的效率,比如微软的live,其中的js做了压缩处理。JS的速度分为两种,下载速度和执行速度。今天就先来说说下载速度。要想js的下载速度快,就需要尽量减小js文件的大小。这里我们可以使用一个工具ESC(ECMAScript cruncher)来帮我们完成这个工作,不过这个工具只能在Windows下使用。到http://www.saltstorm.net/depo/esc/introduction.wbm?pod=js下载ESC.zip,解压后看看它的帮助文档。很简单。

    ESC Introduction
    ESC is an ECMAScript pre-processor written in JScript, enabling an unlimited number of external scripts to be compressed/crunched into supertight, bandwidth-optimized packages. Featuring several compression-techniques such as comment removal, whitespace stripping, newline stripping and variable substitution ESC can reduce the overall size of your code with up to ~45%. Single, multiple scripts and even directories with scripts can be merged together at the compression level you decide. The processed output can later be appended or written to a file, or piped to another application for further processing via STDOUT.
      
    ESC do NOT support crunching of inline scripts. So any attempt passing HTML, ASP, JSP, PHP or other equivalent documents to ESC is done at your own risk.  
      
    ESC supports four levels of compression, where a higher level equals higher compression. Beware though that levels >2 requires your code to be syntaxically perfect or ESC will punish you by producing a broken and useless output.  
      
    The compression ratio should hit around 25% using the default compression level on a vanilla looking script, but results as high as ~45% can be achieved depending on the script's design / your style of writing code.  
      
    ESC's compression engine is intelligent in the meaning that it has language syntax, statement and keyword awareness and it *knows* about native objects and members provided by the most common scripting hosts. This knowledgebase can easily be extended by pluggin in userdefined maps with additional information to further gain control of the crunching procedure. During processing following things are taken into account :  
      
    String and RegExpression read-ahead
    Jscript Conditional compilation statements and variables
    ECMA-262 Core language definitions (ECMAScript)
    Intermediate DOM's (level 0) and DOM level 1
    MS Jscript specific objects/methods
    Netscape/Mozilla/Opera specific objects/methods/properties
    MS WSH (Windows Scripting Host) 1+ native objects  

    压缩级别分为5种,从0到4

    Level 0 :: No compression

    Level 1 :: Comment removal

    Level 2 :: Whitespace removal

    Level 3 :: Newline removal

    Level 4 :: Variable substitution

    在WINDOWS命令行下执行

    cscript ESC.wsf -ow menu2.js menu.js将会把menu.js按照js压缩级别2来压缩(默认js压缩级别为2)为menu2.js

    cscript ESC.wsf -l 3 -ow menu3.js menu.js将会把menu.js按照js压缩级别3来压缩为menu3.js

    需要注意的是,js压缩级别4会把变量名修改,如果你的js中用到了全局变量或者类的话,就不能使用该压缩级别了,否则其它使用你的js的文件可能会无法正常运行。

    试了一下,把yui的menu.js压缩了一下,对应的级别和压缩率分别如下:

    js压缩级别1:压缩率44.41%

    js压缩级别2:压缩率62.82%

    js压缩级别1:压缩率64.93%

    原来130多K的js文件压缩后也就40多K,看来还是挺有用处的。


    另外还有一个小工具jsmin也可以压缩,不过没有ESC的level选项,看了一下好像压缩效果类似于ESC的level3.济南大学的一些老师写了个jsmin的图形界面程序JsMinGUI,使用起来更加方便。:-)

    Dojo项目组也提供了一个工具,shrinksafe可以通过http://alex.dojotoolkit.org/shrinksafe/在线的上传要压缩的文件,处理完毕后可以保存到本地,另外shrinksafe还提供了一个本地运行的版本,需要jre1.4的支持。

    Ps:对于一些压缩的代码,在阅读时可以用JavaScript Code Improver来进行格式化。看看它主页上的一个例子:
    javascript压缩代码示例
    原来的代码:

    <script type="text/javascript"></script>



    格式化后:

    <script type="text/javascript"></script>




    js压缩,巨NB的dHTML特效. 来自:
    http://hometown.aol.de/_ht_a/memtronic/MemTronic_CruncherCompressor_v09g.html

    JS压缩示例样本:JS压缩示例样本


    更多的JS压缩器以及混淆器
    http://dean.edwards.name/packer/  在线Js压缩
    A Online JavaScript Compressor/Obfuscator version 2.0.2
    Also available as a .NET application
    开源下载:http://dean.edwards.name/download/#packer
    JS压缩器帮助:http://dean.edwards.name/packer/usage/
    http://dean.edwards.name/packer/usage/sample.html

    http://hometown.aol.de/_ht_a/memtronic/

    JavaScript Compressor/Obfuscator Demo:
    http://www.brainjar.com/js/crunch/demo.html

    JavaScript Code Improver:
    JavaScript Code Improver Download


    前面提到的Javascript压缩,都是采用删除注释,删除多余空格,替换字符等方式进行的,还有一种通过服务器的配置来实现Js静态压缩的方法:
    关于JavaScript的gzip静态压缩方法
    传统的JS压缩(删除注释,删除多余空格等)提供的压缩率有时还是不尽不意,幸亏现在的浏览器都支持压缩传输(通过设置http header的Content-Encoding=gzip),可以通过服务器的配置(如apache)为你的js提供压缩传输,或是appfuse中使用的GZipFilter使tomcat也提供这种能力

    现在的问题是这种动态的压缩会导致服务器CPU占用率过高,现在我想到的解决辨法是通过提供静态压缩(就是将js预先通过gzip.exe压缩好)

    一.下面描述在tomcat中的应用

    1.将prototype.js通过gzip.exe压缩保存成prototype.gzjs
    2.设置header,我编写了一个简单的AddHeadersFilter来将所有以gzjs结尾的文件增加设置header Content-Encoding=gzip
    web.xml中的配置

    引用
      
        AddHeaderFilter  
          
            badqiu.web.filter.AddHeaderFilter  
          
          
            headers  
            Content-Encoding=gzip  
          
      
      
      
        AddHeaderFilter  
        *.gzjs  



    测试prototype.js是否正常的代码

      
      
      
    <script src="\&amp;quot;prototype.gzjs\&quot;" type="\&amp;quot;text/javascript\&quot;"></script>   
      
      
        
      
          
    <script type="text/javascript"></script>   
      



    在Apache httpd中可以直接通过在httpd.conf增加AddEncoding x-gzip .gzjs来映射.gzjs文件的header

    二.相关压缩率数据
    1. prototype.js 1.5.0_rc0原始大小56KB,未经任何处理直接使用gzip压缩为12KB,总压缩率79%
    2. 通过js压缩工具压缩过的protytype.js为20KB,使用gzip压缩为10KB,总压缩率为83%
    3. 实际项目中的多个js合并成的文件 439KB,直接通过gzip压缩为85KB,总压缩率81%
    4. 439KB经过js压缩为165KB,再经过gzip压缩为65KB,总压缩率86%

    基本上你都可以忽略js压缩工具的压缩率,直接使用gzip压缩

    gzip下载地址 http://www.gzip.org
    tomcat的压缩配置示例下载地址: http://www.blogjava.net/Files/badqiu/gziptest.rar

    其主要是利用服务器自带的动态压缩功能 传输时压缩数据流.

    Javascript compressed,Js压缩,javascript压缩,js压缩工具,js压缩合并,js文件压缩

    展开全文
  • 怎么压缩Js?为什么要压缩JavascriptJavascript compressed/crunched开发Ajax除了自己要写js代码外,同样也免不了要使用其它第三方js库,是否该为JavaScript减肥?当你提高了用户体验,做出了很绚丽的效果而欣喜...
     
    怎么压缩Js?为什么要压缩Javascript? Javascript compressed/crunched
    开发Ajax除了自己要写js代码外,同样也免不了要使用其它第三方js库,是否该为JavaScript减肥?
    当你提高了用户体验,做出了很绚丽的效果而欣喜的时候,是否想过优化一下JS的效率,比如微软的live,其中的js做了压缩处理。JS的速度分为两种,下载速度和执行速度。今天就先来说说下载速度。要想js的下载速度快,就需要尽量减小js文件的大小。这里我们可以使用一个工具ESC (ECMAScript cruncher)来帮我们完成这个工作,不过这个工具只能在Windows下使用。到
    http://www.saltstorm.net/depo/esc/introduction.wbm?pod=js 下载 ESC.zip ,解压后看看它的帮助文档。很简单。

    ESC Introduction
    ESC is an ECMAScript pre-processor written in JScript, enabling an unlimited number of external scripts to be compressed/crunched into supertight, bandwidth-optimized packages. Featuring several compression-techniques such as comment removal, whitespace stripping, newline stripping and variable substitution ESC can reduce the overall size of your code with up to ~45%. Single, multiple scripts and even directories with scripts can be merged together at the compression level you decide. The processed output can later be appended or written to a file, or piped to another application for further processing via STDOUT.
      
    ESC do NOT support crunching of inline scripts. So any attempt passing HTML, ASP, JSP, PHP or other equivalent documents to ESC is done at your own risk.  
      
    ESC supports four levels of compression, where a higher level equals higher compression. Beware though that levels >2 requires your code to be syntaxically perfect or ESC will punish you by producing a broken and useless output.  
      
    The compression ratio should hit around 25% using the default compression level on a vanilla looking script, but results as high as ~45% can be achieved depending on the script's design / your style of writing code.  
      
    ESC's compression engine is intelligent in the meaning that it has language syntax, statement and keyword awareness and it *knows* about native objects and members provided by the most common scripting hosts. This knowledgebase can easily be extended by pluggin in userdefined maps with additional information to further gain control of the crunching procedure. During processing following things are taken into account :  
      
    String and RegExpression read-ahead
    Jscript Conditional compilation statements and variables
    ECMA-262 Core language definitions (ECMAScript)
    Intermediate DOM's (level 0) and DOM level 1
    MS Jscript specific objects/methods
    Netscape/Mozilla/Opera specific objects/methods/properties
    MS WSH (Windows Scripting Host) 1+ native objects  

    压缩级别分为5种,从0到4

    Level 0 :: No compression

    Level 1 :: Comment removal

    Level 2 :: Whitespace removal

    Level 3 :: Newline removal

    Level 4 :: Variable substitution

    在WINDOWS命令行下执行(蓝色乌托邦:双击下载文件中的ESC.wsf ,拷贝要压缩的js文件到同一个目录)

    cscript ESC.wsf -ow menu2.js menu.js将会把menu.js按照js压缩级别2来压缩(默认js压缩级别为2)为menu2.js

    cscript ESC.wsf -l 3 -ow menu3.js menu.js将会把menu.js按照js压缩级别3来压缩为menu3.js

    需要注意的是,js压缩级别4会把变量名修改,如果你的js中用到了全局变量或者类的话,就不能使用该压缩级别了,否则其它使用你的js的文件可能会无法正常运行。

    试了一下,把yui的menu.js压缩了一下,对应的级别和压缩率分别如下:

    js压缩级别1:压缩率44.41%

    js压缩级别2:压缩率62.82%

    js压缩级别1:压缩率64.93%

    原来130多K的js文件压缩后也就40多K,看来还是挺有用处的。


    另外还有一个小工具
    jsmin 也可以压缩,不过没有ESC的level选项,看了一下好像压缩效果类似于ESC的level3.济南大学的一些老师写了个jsmin的图形界面程序 JsMinGUI ,使用起来更加方便。:-)

    Dojo项目组也提供了一个工具,shrinksafe可以通过
    http://alex.dojotoolkit.org/shrinksafe/ 在线的上传要压缩的文件,处理完毕后可以保存到本地,另外shrinksafe还提供了一个本地运行的版本,需要jre1.4的支持。

    Ps:对于一些压缩的代码,在阅读时可以用
    JavaScript Code Improver 来进行格式化。看看它主页上的一个例子:
    javascript压缩代码示例
    原来的代码:
    程序代码 程序代码
    <script language="JavaScript">var i=0,s="",k=0;function foo(){for(j=0;j<10;j++){for(i=0;i<10;i++){s="string1";k=Math.floor(Math.random()*10);}for(i=20;i>9;i--){s="string2";k=I;}}}</script>


    格式化后:
    程序代码 程序代码
    <script language="JavaScript">
    var I = 0, s = "", k = 0;
    function foo()
    {
    for(j = 0; j < 10; j++)
    {
    for(I = 0; I < 10; i++)
    {
    s = "string1";
    k = Math.floor( Math.random()*10 );
    }
    for(I = 20; I > 9; i--)
    {
    s = "string2";
    k = I;
    }
    }
    }
    </script>



    js压缩,巨NB的dHTML特效. 来自:
    http://hometown.aol.de/_ht_a/memtronic/MemTronic_CruncherCompressor_v09g.html

    JS压缩示例样本: JS压缩示例样本


    更多的JS压缩器以及混淆器
    http://dean.edwards.name/packer/   在线Js压缩
    A Online JavaScript Compressor/Obfuscator version 2.0.2
    Also available as a .NET application
    开源下载: http://dean.edwards.name/download/#packer
    JS压缩器帮助: http://dean.edwards.name/packer/usage/
    http://dean.edwards.name/packer/usage/sample.html

    http://hometown.aol.de/_ht_a/memtronic/

    JavaScript Compressor/Obfuscator Demo:
    http://www.brainjar.com/js/crunch/demo.html

    JavaScript Code Improver:
    JavaScript Code Improver Download


    前面提到的Javascript压缩,都是采用删除注释,删除多余空格,替换字符等方式进行的,还有一种通过服务器的配置来实现Js静态压缩的方法:
    关于JavaScript的gzip静态压缩方法
    传统的JS压缩(删除注释,删除多余空格等)提供的压缩率有时还是不尽不意,幸亏现在的浏览器都支持压缩传输(通过设置http header的Content-Encoding=gzip),可以通过服务器的配置(如apache)为你的js提供压缩传输,或是appfuse中使用的GZipFilter使tomcat也提供这种能力

    现在的问题是这种动态的压缩会导致服务器CPU占用率过高,现在我想到的解决辨法是通过提供静态压缩(就是将js预先通过gzip.exe压缩好)

    一.下面描述在tomcat中的应用

    1.将prototype.js通过gzip.exe压缩保存成prototype.gzjs
    2.设置header,我编写了一个简单的AddHeadersFilter来将所有以gzjs结尾的文件增加设置header Content-Encoding=gzip
    web.xml中的配置
    引用内容 引用内容
    <filter>  
         <filter-name>AddHeaderFilter</filter-name>  
         <filter-class>  
             badqiu.web.filter.AddHeaderFilter   
         </filter-class>  
         <init-param>  
             <param-name>headers</param-name>  
             <param-value>Content-Encoding=gzip</param-value>  
         </init-param>  
    </filter>  
      
    <filter-mapping>  
         <filter-name>AddHeaderFilter</filter-name>  
         <url-pattern>*.gzjs</url-pattern>  
    </filter-mapping>


    测试prototype.js是否正常的代码
    程序代码 程序代码
    <html>  
    <head>  
    <!-- type="text/javascript"不可少,有的浏览器缺少这个不能运行 -->  
    <script src="prototype.gzjs" type="text/javascript"></script>  
    </head>  
    <body>  
         <input id="username" name="username" value="badqiu"/><br />  
         <input id="email" value="badqiu@gmail.com"/>  
    <script>  
         <!-- 测试prototype的方法是否正常-->  
         alert($F('username'))   
    </script>  
    </body>  
    </html>


    在Apache httpd中可以直接通过在httpd.conf增加AddEncoding x-gzip .gzjs来映射.gzjs文件的header

    二.相关压缩率数据
    1. prototype.js 1.5.0_rc0原始大小56KB,未经任何处理直接使用gzip压缩为12KB,总压缩率79%
    2. 通过js压缩工具压缩过的protytype.js为20KB,使用gzip压缩为10KB,总压缩率为83%
    3. 实际项目中的多个js合并成的文件 439KB,直接通过gzip压缩为85KB,总压缩率81%
    4. 439KB经过js压缩为165KB,再经过gzip压缩为65KB,总压缩率86%

    基本上你都可以忽略js压缩工具的压缩率,直接使用gzip压缩

    gzip下载地址 http://www.gzip.org/
    tomcat的压缩配置示例下载地址: http://www.blogjava.net/Files/badqiu/gziptest.rar

    其主要是利用服务器自带的动态压缩功能 传输时压缩数据流.
    展开全文
  • 开发Ajax除了自己要写js代码外,同样也免不了要使用其它第三方js库,是否该为JavaScript减肥? 当你提高了用户体验,做出了很绚丽的效果而欣喜的时候,是否想过优化一下JS的效率,比如微软的live,其中...
  • 使用场景:app的日志接口需要大量提交日志给服务器,每30s提交一次,一次性最多提交50条日志数据,日志信息包含大量文本数据,导致数据传输量大,故后端的接口改成接受gizp压缩后的数据流 java接口定义: 前端...
  • Javascript压缩(Js压缩)工具聚合(www.ad0.cn 整理)怎么压缩Js?为什么要压缩Javascript? Javascript compressed/crunched开发Ajax除了自己要写js代码外,同样也免不了要使用其它第三方js库,是否该为JavaScript减肥...
  • 主要介绍了node.js使用zlib模块进行数据压缩和解压操作,结合实例形式详细分析了node.js基于zlib模块创建数据流以及压缩和解压缩等相关操作技巧,需要的朋友可以参考下
  • 怎么压缩Js?为什么要压缩JavascriptJavascript compressed/crunched开发Ajax除了自己要写js代码外,同样也免不了要使用其它第三方js库,是否该为JavaScript减肥?当你提高了用户体验,做出了很绚丽的效果而欣喜...
  • cocos creator 利用 zlib.js 进行数据压缩与解压。 因本项目在cocos 项目中,使用了egret的部分数据结构,例如 egret.ByteArray。所以这里用举例。 作者Githttps://github.com/imaya/zlib.js 文档不难...
  • 在web性能优化的时候,经常会使用到压缩神器gzip。当客户端(浏览器)向服务端发起资源请求时,服务器首先会对比较大的资源进行压缩,然后再返回给客户端,以此加快资源的访问速度。 下面来看压缩和解压缩的demo: ...
  • ajax+pako.js实现gzip数据压缩上传,解决post数据过长问题 http://blog.csdn.net/jodenhe/article/details/70983781
  • 相信很多人在开发中都不可避免会遇到数据...2、使用gzip对数据进行压缩,再将数据请求发回后台,后台获取并对数据进行解压(这个实现比较简单,而且对数据进行压缩传递,可以优化网络性能,不过如果数据量过大,压缩
  • 项目开发中常常会遇到前后端之间有大量数据传输占用带宽导致页面响应慢的问题,这时候我们可以考虑使用Pako.js对信息进行压缩之后传输。 我在前端使用的是vue-element-admin前端框架。框架中有Pako.js包所以直接...
  • js压缩处理

    千次阅读 2017-04-01 11:02:18
    前言: 现在很多web项目中都会...所以可以通过压缩处理将js或者css压缩减小网络流量? 工具说明:  YUI compressor 是Java编写的压缩工具,由雅虎发布,压缩是 100% 的安全,比大多数其他工具有更高的压缩比,
  • php+pako+ajax压缩数据

    2017-12-13 13:56:20
    php开发ajax大数据进行压缩、解压操作 ,使用pako.js技术压缩数据
  • resourcetiming-compression.js压缩数据。 配套脚本resourcetiming-decompression.js将压缩后的数据转换回原始格式。 是W3C网络性能API,可将所有页面资源的网络计时信息提供给开发人员,并且在大多数均可使用。 ...
  • JS前端上传图片、压缩、并且处理旋转问题,生成base64数据
  • JS格式化/压缩JSON数据

    万次阅读 2016-02-18 16:11:26
    使用方法,format(json)...format(json,true)为开启压缩模式。 function format(txt,compress/*是否为压缩模式*/){/* 格式化JSON源码(对象转换为JSON文本) */ var indentChar = ' '; if(/^\s*$/.test(txt)){
  • JS 使用 lz-string存储 数据压缩

    千次阅读 2019-05-13 09:02:37
    我们可以压缩的是您可以存储的更多数据。好在JS 有lz - string 库 引入库 <script src="https://cdn.bootcss.com/lz-string/1.4.4/lz-string.js"></script> <script> var string ="自由网f...
  • dna-data-compessor是一个很小的库,它可以将DNA序列数据javascript中的字符串数据类型)快速转换(和压缩)为二进制数据,反之亦然。 它可以提供最大程度的DNA数据压缩(我们假设核苷酸的分配是随机的)。 这...
  • JS文件压缩min

    2018-09-12 15:36:28
    JS压缩成min格式的工具,亲测可以使用。直接导入js文件点击压缩即可。 欢迎评论
  • Netty websocket 推送数据压缩js解压

    千次阅读 2017-11-24 12:03:11
    Netty websocket 推送数据压缩js解压 在项目开发的时候利用基于Netty 的websocket项目,有时会发现在推送过程中经常不推送了。经过研究调查发现服务器在高并发的情况下,推送的数据流量接近带宽流量峰值,会...
  • js压缩原理

    千次阅读 2015-01-22 09:17:17
    一、为什么要进行Javascript压缩? 1、减少JS代码容量,增加下载速度和执行速度; 2、压缩后的JS代码不具备可识性,在一定程度上达到加密效果,防止被人轻易使用。 二、常规Javascript压缩的原理: 1、...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 128,699
精华内容 51,479
热门标签
关键字:

js压缩数据