CSS和JS文件经常需要压缩,比如我们看到的XX.min.js是经过压缩的JS。

  压缩文件第一个是可以减小文件大小,第二个是对于JS文件,默认会去掉所有的注释,而且会去掉所有的分号,也会将我们的一些参数替换为一些简单的a,b之类的变量,从界面看起来非常难阅读,起到加密作用。

  常见的有好多压缩工具,这里使用yui进行压缩,首先需要下载yui的包:  yuicompressor-2.4.7.jar  ,可以到我的服务器下载:http://qiaoliqiang.cn/fileDown/yuicompressor-2.4.7.zip

1.查看yui使用帮助:

G:\>java -jar yuicompressor-2.4.7.jar

Usage: java -jar yuicompressor-x.y.z.jar [options] [input file]

Global Options
-h, --help Displays this information
--type <js|css> Specifies the type of the input file
--charset <charset> Read the input file using <charset>
--line-break <column> Insert a line break after the specified column number
-v, --verbose Display informational messages and warnings
-o <file> Place the output into <file>. Defaults to stdout.
Multiple files can be processed using the following syntax:
java -jar yuicompressor.jar -o '.css$:-min.css' *.css
java -jar yuicompressor.jar -o '.js$:-min.js' *.js JavaScript Options
--nomunge Minify only, do not obfuscate
--preserve-semi Preserve all semicolons
--disable-optimizations Disable all micro optimizations If no input file is specified, it defaults to stdin. In this case, the 'type'
option is required. Otherwise, the 'type' option is required only if the input
file extension is neither 'js' nor 'css'.

2.压缩JS:

  默认会去掉所有的注释,而且会去掉所有的分号,也会将我们的一些参数替换为一些简单的a,b之类的变量,起到加密作用。

JS内容:

/**
* 验证密码和账户
*/
function validate2(username, password) {
if (username != "zhangsan") {
alert("userName is error:" + c)
}
if (password != "123456") {
alert("password is error:" + d)
}
};

源文件大小:220字节

 进行压缩:

G:\>java -jar yuicompressor-2.4.7.jar index.js -v -o index-min.js --charset UTF-8

参数解释:

index.js  需要压缩的源文件
-v -o 显示信息与指定输出文件名字
index-min.js 压缩后的文件
--charset 指定编码格式

压缩后文件内容和大小:(被压缩成一行,注释被去掉,分号也被去掉)

function validate2(b,a){if(b!="zhangsan"){alert("userName is error:"+c)}if(a!="123456"){alert("password is error:"+d)}};

大小为:120字节

我们也可以保留分号:    --preserve-semi 参数

G:\>java -jar yuicompressor-2.4.7.jar index.js -v --preserve-semi -o index-min.js --charset UTF-8

[WARNING] The symbol c is declared but is apparently never used.
This code can probably be written in a more compact way.
username!="zhangsan"){alert("userName is error:"+ ---> c <--- );}if(password!="123456"){ [WARNING] The symbol d is declared but is apparently never used.
This code can probably be written in a more compact way.
password!="123456"){alert("password is error:"+ ---> d <--- );}}

压缩后内容:

function validate2(b,a){if(b!="zhangsan"){alert("userName is error:"+c);}if(a!="123456"){alert("password is error:"+d);}}

3.压缩CSS

G:\>java -jar yuicompressor-2.4.7.jar index.css -v -o index1-min.css --charset UTF-8

也可以写成bat脚本进行压缩JS和css,此处就不写了。

接下来研究Java中调用yui压缩JS和css。原理是Java调用RuntTime执行cmd中的一些命令,只是写了个for循环遍历文件夹下main的css和js文件进行遍历。同样依赖上面的jar包:

工具类如下:

package zdComputerTest;

import java.io.File;
import java.io.IOException;
import java.util.ArrayList;
import java.util.Arrays;
import java.util.Date;
import java.util.List; /**
* 通过yuicompressor压缩JS|CSS文件工具类
* @author Administrator
*
*/
public class CompressUtils {
private static final String encoding = "utf-8";
private static final String[] suffixArray = { ".js", ".css" }; public static void main(String[] args) {
String yuiPath = "G:/yuicompressor-2.4.7.jar";
String filePath = "G:/js"; compressFile(yuiPath, filePath);
} /**
* 压缩指定文件夹下所有的js/css
*
* @param yuiPath
* yuicompressor-2.4.7.jar文件路径
* @param filePath
* 要压缩的文件夹路径
*/
public static void compressFile(String yuiPath, String filePath) {
File file = new File(filePath);
List<String> commondList = new ArrayList<String>();
initCommondList(yuiPath, commondList, file);
excuteCompress(commondList);
} /**
* 执行压缩命令
* @param commondList
*/
private static void excuteCompress(List<String> commondList) {
Runtime runTime = Runtime.getRuntime();
Date startTime = new Date();
Long count = 0L;
for (String cmd : commondList) {
try {
System.out.println(cmd);
runTime.exec(cmd);
count++;
} catch (IOException e) {
e.printStackTrace();
}
}
Date endTime = new Date();
Long cost = endTime.getTime() - startTime.getTime();
System.out.println("压缩完成,耗时:" + cost + "ms,共压缩文件个数:" + count);
} /**
* 初始化压缩命令
* @param yuiPath
* @param commondList
* @param file
*/
private static void initCommondList(String yuiPath,
List<String> commondList, File file) {
if (file.isDirectory()) {
File[] files = file.listFiles();
// 如果某个文件夹是空文件夹,则跳过
if (files == null) {
return;
}
for (File f : files) {
initCommondList(yuiPath, commondList, f);
}
} else {
String fileName = file.getName();
String suffix = fileName.substring(fileName.lastIndexOf("."),
fileName.length()); List<String> suffixList = Arrays.asList(suffixArray);
if (suffixList.contains(suffix)
&& !fileName.endsWith("-min" + suffix)) {
StringBuffer sb = new StringBuffer();
sb.append("java -jar ");
sb.append(yuiPath);
sb.append(" --type ");
sb.append(suffix.substring(suffix.indexOf(".") + 1));
sb.append(" --charset ");
sb.append(encoding).append(" ");
sb.append(file.getPath()).append(" ");
sb.append("-o").append(" ");
sb.append(file.getPath().replace(suffix, "-min" + suffix)); commondList.add(sb.toString());
} }
}
}

4.Ant整合yui压缩JS的脚本

项目结构:

 build.xml脚本:(此脚本可以编译项目中的src下的文件和压缩JS和CSS)

<project name="exam" default="js-css-compress" basedir=".">
<!--import properties -->
<property file="build.properties">
</property> <path id="exam.lib">
<fileset dir="${tomcatPath}/lib">
<include name="*.jar" />
</fileset>
<fileset dir="${basedir}/WebContent/WEB-INF/lib">
<include name="*.jar" />
</fileset>
</path> <target name="testTarget">
<echo message="${examJsRootPath}" />
</target> <target name="cleanExamBuildFolder">
<delete dir="${basedir}/dist/examBuildClass" />
<delete dir="${basedir}/dist/examJavaCodeJar" />
<echo message="delete ${basedir}/dist/examBuildClass and ${basedir}/dist/examJavaCodeJar "/> <mkdir dir="${basedir}/dist/examBuildClass" />
<mkdir dir="${basedir}/dist/examJavaCodeJar" />
<echo message="mkdir ${basedir}/dist/examBuildClass and ${basedir}/dist/examJavaCodeJar "/>
</target> <!--编译项目中的源代码-->
<target name="buildSrcCode" depends="cleanExamBuildFolder">
<javac encoding="utf-8" srcdir="${basedir}/src" excludes="cn/xm/exam/test/**" destdir="${basedir}/dist/examBuildClass" classpathref="exam.lib" includeAntRuntime="false" fork="true">
<compilerarg line="-encoding UTF-8 " />
</javac>
<echo message="编译成功" level="info"/>
</target> <!--打包编译后的classes文件-->
<target name="jarSrcCode" depends="buildSrcCode">
<jar destfile="${basedir}/dist/examJavaCodeJar/${jarName}-${jarNumber}.jar" basedir="${basedir}/dist/examBuildClass" includes="**/*.class" excludes="**/Test.class">
</jar>
<echo message="jar success!"/> <delete dir="${basedir}/dist/examBuildClass" />
<echo message="delete ${basedir}/dist/examBuildClass"/>
</target> <target name="js-css-compress">
<java jar="dist/lib/yuicompressor-2.4.7.jar" fork="true" maxmemory="128m">
<arg value="--charset" />
<arg value="UTF-8" />
<arg value="${examJsRootPath}/examParper/examPaper/examparperManage.js" />
<arg value="-o" />
<arg value="${examJsRootPath}/examParper/examPaper/examparperManage.min.js" />
</java>
<echo message="${examJsRootPath}/examParper/examPaper/examparperManage.js compressed succes"/> <java jar="dist/lib/yuicompressor-2.4.7.jar" fork="true" maxmemory="128m">
<arg value="--charset" />
<arg value="UTF-8" />
<arg value="${examJsRootPath}/examParper/addExamparper/index3question.js" />
<arg value="-o" />
<arg value="${examJsRootPath}/examParper/addExamparper/index3question.min.js" />
</java>
<echo message="${examJsRootPath}/examParper/addExamparper/index3question.js compressed succes"/> <java jar="dist/lib/yuicompressor-2.4.7.jar" fork="true" maxmemory="128m">
<arg value="--charset" />
<arg value="UTF-8" />
<arg value="${examJsRootPath}/examParper/exam/addExam.js" />
<arg value="-o" />
<arg value="${examJsRootPath}/examParper/exam/addExam.min.js" />
</java>
<echo message="${examJsRootPath}/examParper/exam/addExam.js compressed succes"/> <java jar="dist/lib/yuicompressor-2.4.7.jar" fork="true" maxmemory="128m">
<arg value="--charset" />
<arg value="UTF-8" />
<arg value="${examJsRootPath}/examParper/exam/updateExam.js" />
<arg value="-o" />
<arg value="${examJsRootPath}/examParper/exam/updateExam.min.js" />
</java>
<echo message="${examJsRootPath}/examParper/exam/updateExam.js compressed succes"/> <java jar="dist/lib/yuicompressor-2.4.7.jar" fork="true" maxmemory="128m">
<arg value="--charset" />
<arg value="UTF-8" />
<arg value="${examJsRootPath}/outDepart/outdepartEmpAndBreakRulesInfoManager.js" />
<arg value="-o" />
<arg value="${examJsRootPath}/outDepart/outdepartEmpAndBreakRulesInfoManager.min.js" />
</java>
<echo message="${examJsRootPath}/outDepart/outdepartEmpAndBreakRulesInfoManager.js compressed succes"/> </target>
</project>

 build.properties

tomcatPath=E:/tomcat/apache-tomcat-7.0.72
jarName=commons-exam-code
jarNumber=1.0.1
examJsRootPath=${basedir}/WebContent/js

yui压缩JS和CSS文件的更多相关文章

  1. [Asp.net MVC]Bundle合并,压缩js、css文件

    摘要 在web优化中有一种手段,压缩js,css文件,减少文件大小,合并js,css文件减少请求次数.asp.net mvc中为我们提供一种使用c#代码压缩合并js和css这类静态文件的方法. 一个例 ...

  2. 使用grunt合并压缩js、css文件

    需要了解的知识: 1.nodejs的安装与命令行使用 2.nodejs安装应用 3.grunt的初步了解 本文已假定读者已经熟悉以上知识. 好,我们继续: 任务1:将src目录下的所有zepto及插件 ...

  3. 使用yuicompressor-maven-plugin压缩js及css文件

    本文介绍通过使用yuicompressor-maven-plugin插件实现js及css代码的自动压缩,方便集成到持续集成环境中,如jenkins. 一.配置yuicompressor-maven-p ...

  4. (转)使用yuicompressor-maven-plugin压缩js及css文件(二)

    本文介绍通过使用yuicompressor-maven-plugin插件实现js及css代码的自动压缩,方便集成到持续集成环境中,如jenkins. 一.配置yuicompressor-maven-p ...

  5. grunt 合并压缩js和css文件(二)

    具体node及文件配置请看: grunt 安装使用(一) 要压缩的文件 --src/ ajax.js assets.js touch.js zepto.js 目录结构: dist/ node_modu ...

  6. IIS 7 启用 gzip 静态压缩 压缩js和css文件

    搞了很久,不如nginx好弄,不知道怎么修改压缩比,也不知道怎么压缩的规则是啥(管理器上没有写),不过反正出来了,一个js文件900多K变成了100多K 1.在web.config文件里面加上: &l ...

  7. 项目中对模板和js,css文件进行压缩的处理类

    我们知道,在html的页面中,所有空格和换行符其实都会占据一定的空间,即使使用了gzip压缩,在传输过程中依然会浪费用户的流量和我们自己服务器的带宽,此脚本就是为了解决这个问题而诞生的. 请自行下载G ...

  8. maven中用yuicompressor和closure-compiler对js、css文件进行压缩

    转载自:http://matychen.iteye.com/blog/1477350 项目采用maven构建的时候,需要压缩js,css等,网上找了相关资料,自己综合了下-  直接放代码: <! ...

  9. grunt 单独压缩多个js和css文件【转】

    原文地址:http://xiaomiya.iteye.com/blog/2177877 使用grunt来压缩前端js,css文件 因为最近做的客户端本地项目有用到十几个js,js提交之前都需要压缩.用 ...

随机推荐

  1. maybe i have no answer

    怎么说呢,我从小学开始到高中,大学.我觉得老师对大家都是一样的,虽然我因为父母的原因可能和老师接触比较多,但是学业上其实没什么帮助的. 我更希望老师能给我人生道路上的指点,虽然自己的道路确实是自己走出 ...

  2. Day Six

    站立式会议 站立式会议内容总结 442 今天:实现计划界面的逻辑 遇到的问题:模态框问题 明天:解决上面问题,开始使用动态数据 331 今天:点击添加找到文件 遇到问题:找到文件在app的引入实现 明 ...

  3. DirectoryEntry_Properties属性的遍历(win2003)

    DirectoryEntry root = new DirectoryEntry(@"IIS://localhost/W3SVC"); string PInfo = "& ...

  4. Python爬虫:如何爬取分页数据?

    上一篇文章<Python爬虫:爬取人人都是产品经理的数据>中说了爬取单页数据的方法,这篇文章详细解释如何爬取多页数据. 爬取对象: 有融网理财项目列表页[履约中]状态下的前10页数据,地址 ...

  5. Orchard是如何运行的

    建立一个CMS网站(内容管理系统)是不同于建立一个普通的web站点:它更像是建立一个应用程序容器. 设计这样一个系统时,必须建立一流的可扩展性功能.这必需是一个非常开放式的构架,但是一个开放性的系统可 ...

  6. python 十进制整数转换为任意进制(36以内)

    def baseN(num, b): return ((num == 0) and "0") or (baseN(num // b, b).lstrip("0" ...

  7. 用Setup Factory7.0怎样打包delphi的BDE?

    BDE打包发布实例操作步骤如下: 使用软件:Setup Factory 7.0打包 把C:\Program Files\Common Files\Borland Shared中的所有文件和你的开发的应 ...

  8. obj.getClass() == Person.class 用于判断类型

    obj.getClass() == Person.class  用于判断类型

  9. 洛谷 P2527 [SHOI2001]Panda的烦恼 解题报告

    P2527 [SHOI2001]Panda的烦恼 题目描述 panda是个数学怪人,他非常喜欢研究跟别人相反的事情.最近他正在研究筛法,众所周知,对一个范围内的整数,经过筛法处理以后,剩下的全部都是质 ...

  10. 【uoj7】 NOI2014—购票

    http://uoj.ac/problem/7 (题目链接) 题意 给出一棵有根树,每次从一个节点出发可以买票到达它的一定范围内的祖先.问对于每一个点,到达根的最小花费是多少. Solution 右转 ...