• 35648

    文章

  • 23

    评论

  • 20

    友链

  • 最近新加了很多技术文章,大家多来逛逛吧~~~~
  • 喜欢这个网站的朋友可以加一下QQ群,我们一起交流技术。

JavaScript自动化(三) 文件压缩

欢迎来到阿八个人博客网站。本 阿八个人博客 网站提供最新的站长新闻,各种互联网资讯。 喜欢本站的朋友可以收藏本站,或者加QQ:我们大家一起来交流技术! URL链接:https://www.abboke.com/xwzhj/2019/0611/354.html

文章目录

  1. 1. 压缩工具
  2. 2. 使用Closure Compiler压缩JS文件
  3. 3. 使用YUI compressor压缩CSS文件


微信公众号

前端使用ant的一个核心任务,就是压缩js/css文件以减少文件大小。

压缩工具

  • UglifyJS
    用 NodeJS 编写的 JavaScript 压缩工具,是目前最流行的JS压缩工具,JQuery 就是使用此工具压缩,UglifyJS 压缩率高。
  • YUI compressor
    Java编写的压缩工具,由雅虎发布,压缩是 100% 的安全,比大多数其他工具有更高的压缩比, 一般代码的压缩率达到 40% 至 60%,YUI compressor 也能够压缩CSS文件,国内互联网公司,阿里、淘宝、百度等都是采用 YUI compressor 内核压缩后发布代码。
  • Closure Compiler
    由google发布的压缩工具,将源代码编译为机器代码的替换,将 JavaScript 编译为更优的 JavaScript。会解析并分析你的 JavaScript,移除死代码、重写并最小化。也可以检查语法、变量引用、类型,并警告 JavaScript 常见的相关陷阱。
  • JsMin
    是用C语言编写的一个轻量级JS压缩器,去除JavaScript文件中的注释和不必要的空格。它通常减少了一半的文件大小,从而导致更快的下载速度。

使用Closure Compiler压缩JS文件

<property name="closure.path" location="tools/lib/compiler.jar"/>
<target name="compress" depends="concat">
    <!-- 压缩js文件 -->
    <apply executable="java" failonerror="true" parallel="false" verbose="true">
        <fileset dir="${build}" includes="*.js"/>
            <arg line="-jar"/>
            <arg path="${closure.path}"/>
            <arg line="--charset utf-8"/>
            <arg value="--warning_level"/>
            <arg value="QUIET"/>
            <arg value="--js"/>
            <srcfile/>
            <arg value="--js_output_file"/>
            <targetfile/>
            <mapper type="glob" from="*.js" to="${build}/*-min.js"/>
    </apply>
</target>

使用YUI compressor压缩CSS文件

<property name="yuicompressor.path" location="tools/lib/yuicompressor-2.4.7.jar"/>
<target name="compress" depends="concat">
        <!-- 压缩css文件 -->
        <apply executable="java" verbose="true" dest="${targetDir}/css" failonerror="true" parallel="false">
            <fileset dir="${build}" includes="*.css"/>
            <arg line="-jar"/>
            <arg path="${yuicompressor.path}"/>
            <arg line="--charset utf-8"/>
            <arg value="--type"/>
            <arg value="css"/>
            <arg value="-o"/>
            <targetfile/>
            <mapper type="glob" from="*.css" to="*-min.css"/>
        </apply>
</target>

相关文章

暂住......别动,不想说点什么吗?
  • 全部评论(0
    还没有评论,快来抢沙发吧!