Yahoo! UI Library: YUI Compressor
虞唯
2023-12-01
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 (see this article by Tenni Theurer on the YUIBlog for more information on browser cache usage). This fact outlines the importance of keeping web pages as lightweight as possible. Improving the engineering design of a page or a web application usually yields the biggest savings and that should always be a primary strategy. With the right design in place, there are many secondary strategies for improving performance such as minification of the code, HTTP compression, using CSS sprites, etc.
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. Each of these tools, however, has drawbacks. JSMIN, for example, does not yield optimal savings (due to its simple algorithm, it must leave many line feed characters in the code in order not to introduce any new bugs).
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.
具体请看这里
[url]http://com3.devnet.re3.yahoo.com/yui/compressor/[/url]
YUI Compressor是使用Java编写的工具
工作原理简介:
主要是去掉冗余的空白,主要包括空格,换行符、制表符。
作为传统的JS压缩,我认识是比较好的了。
针对于大项目来说,用传统的js压缩工具,压缩效率不是很另人满意
现在的浏览器都支持压缩传输(通过设置http header的Content-Encoding=gzip),可以通过服务器的配置(如apache)为你的js提供压缩传输,或是appfuse中使用的GZipFilter使tomcat也提供这种能力(tomcat1.5后自带了。自己配置一下就可以了)。但是这种这种动态的压缩会导致服务器CPU占用率过高
还有种方法就是静态压缩(就是将js预先通过gzip.exe压缩好) ,这是目前我知道的最好的方法,不但提高了压缩效率,而且不占用cpu。有兴趣的可以一起研究探讨下。
===========================华丽的分割线=====================
今天的主要目的是介绍YUI Compressor
1.[url]http://www.julienlecomte.net/yuicompressor/[/url]到这里去下载YUI Compressor
我下载的是最新的2.4.1
2.进入YUI Compressor/build目录下找到yuicompressor-2.4.1.jar
它是一个jar文件。你可以直接拿到编译运行
查看帮助
输入java -jar yuicompressor-2.4.1.jar -h
如下图
[img]/upload/attachment/72413/87499818-ee1c-3bc3-ab93-dd62bf9c4fd0.jpg[/img]
$ java -jar yuicompressor-x.y.z.jar
用法: java -jar yuicompressor-x.y.z.jar [options] [input file]
Global Options
-h, --help 显示帮助信息
--type 指明需要压缩的文件是js还是css。
--charset 指明需要压缩的文件编码类型
--line-break 在指定的列换行
-v,--verbose 显示信息和警告信息
-o 指定输出文件 。默认为标准输出(屏幕)。
JavaScript Options
--nomunge Minify only, do not obfuscate
--preserve-semi Preserve all semicolons
--disable-optimizations disable all micro optimizations
演示下
最简单的语法
java -jar yuicompressor-2.4.1.jar md5.js -o out.js
前后两个演示,你可以看下效果,在附件test12-23.rar里面
再去这个网站http://compressorrater.thruhere.net/
查看,粘贴一个脚本可以在线压缩并比较(在线压缩的是用2.3.5版本。我自己用的是2.4.1.很明显我的压缩效率比较强大)
如图所示
[img]/upload/attachment/72415/b84ff72d-7a61-37ac-beea-706eb480c81d.jpg[/img]