fix | build script for minify js/css | How to minify and bundle css and JS using ant

I wrote a simple build script which is very helpful in minify and bundle css and JS during deployment.
Do this would help in performance as it reduce the http request.

Assume you got 20 JS files, and 20 css files then it is 40 request to the server and it slows down. Instead of that use build script use YUI compressor to reduce it to only 2 request.

BUILD script

<project default=”all”>
<!– Settings for CSS –>
<property name=”css.src-dir” value=”path-to-css-source”/>
<property name=”css.dest-dir” value=”path-to-css-destination”/>
<property name=”css.files” value=”

<!– Settings for JS –>
<property name=”js.src-dir” value=”path-to-js-source”/>
<property name=”js.dest-dir” value=”path-to-js-destination”/>
<property name=”js.files” value=”

<!– General settings –>
<property name=”yuicompressor-jar” value=”path-to-yuicompressor.jar”/>

<target name=”all” depends=”css,javascript”/>

<!– Concat and minimize CSS –>
<target name=”css”>
<echo>Processing CSS</echo>
<!– Concat CSS Files –>
<concat destfile=”${css.dest-dir}/concat.css” encoding=”UTF-8″>
<filelist dir=”${css.src-dir}” files=”${css.files}”/>

<!– Minimize CSS –>
<java jar=”${yuicompressor-jar}” fork=”true”>
<arg line=”–charset UTF-8″/>
<arg line=”–preserve-semi”/>
<arg line=”-o ${css.dest-dir}/min.css”/>
<arg line=”${css.dest-dir}/concat.css”/>

<!– Remove old file–>
<fileset dir=”${css.dest-dir}”>
<include name=”concat.css”/>

<!– Concat and minimize JS –>
<target name=”javascript”>
<echo>Processing Javascript</echo>
<!– Concat JS Files –>
<concat destfile=”${js.dest-dir}/concat.js” encoding=”UTF-8″>
<filelist dir=”${js.src-dir}” files=”${js.files}”/>

<!– Minimize CSS –>
<java jar=”${yuicompressor-jar}” fork=”true”>
<arg line=”–charset UTF-8″/>
<arg line=”–preserve-semi”/>
<arg line=”-o ${js.dest-dir}/js.js”/>
<arg line=”${js.dest-dir}/concat.js”/>

<!– Remove old file–>
<fileset dir=”${js.dest-dir}”>
<include name=”concat.js”/>



Hope this is helpful. If yes drop in your comments


I Am suresh(suresh kumar )a Web developer,Freelancer,webdesigner,UI developer from bangalore. Got 6+ yrs of IT experience . I specialize in standards-based XHTML, CSS and JavaScript web development. Each site I develop is built to be search engine friendly (SEO), using the latest development principles and techniques.

7 Responses

  1. Ninjaios says:

    Very nice! I have a question though, how can i load from html the minified file, when it’s an product build, and load the original file on developement? Thx.

    • suri says:

      use ant script to minify ur files when you deploy as for debugging purpose u might need the files unminified in development environment

  2. pranavpatil19 says:

    i have 10+ more html file ,css ,js file

    when i type ant only minify index.html what

    2)and combine my css file..i dont want to to do that…

    so how i run above script…please help me

  3. Hello, i think that i saw you visited my web site thus i came to “return the
    favor”.I’m trying to find things to enhance my website!I suppose its ok to use a few of your ideas!!

    Feel free to visit my homepage :: best real estate agent In toronto

  4. Good day! This is kind of off topic but I need some help from an established blog.

    Is it tough to set up your own blog? I’m not very techincal but I can figure things out pretty fast. I’m thinking about creating my own but I’m not sure where to begin. Do you have any ideas or suggestions? Thanks

    my web page; toronto seo specialist **

  5. Unquestionably believe that which you said. Your favorite reason seemed to be on
    the net the simplest thing to be aware of. I say to you,
    I certainly get irked while people think about worries that
    they plainly do not know about. You managed to hit the nail upon the top as well as defined out the
    whole thing without having side effect , people can take
    a signal. Will probably be back to get more. Thanks

    Also visit my blog post: best orthodontist nyc

  6. seo st louis says:

    Just wish to say your article is as astounding.
    The clarity in your post is just spectacular and i could assume
    you’re an expert on this subject. Fine with your permission let me to grab your RSS feed to keep up to date with forthcoming post. Thanks a million and please continue the rewarding work.

    my web page :: seo st louis

Leave a Reply

Your email address will not be published. Required fields are marked *