6 Replies Latest reply: Feb 21, 2012 7:14 AM by Jay Balunas RSS

minification strategies

Douglas Campos Newbie

Guys, how will we deal with minification?

  • 1. Re: minification strategies
    Kris Borchers Newbie

    My initial thought was to investigate something like Grunt (https://github.com/cowboy/grunt) for this task. It can do so much more than just minification including linting, concatenation, run QUnit tests and more. I have only started looking at it but it seems pretty easy to setup and configure and I was thinking we might be able to fire it off during the full application build process but that is a little beyond my skill set.

     

    There a couple of small drawbacks. One, it is still in beta so there may be issues but the people I have talked to that use it, love it. Second is that it requires Node.js to run. I don't think this is a big deal but it does require some setup outside of the project. This could be solved with a little bit of documentation or we could look into offering a few options that people could choose from to handle this process and they could choose what ever they may be more comfortable with.

  • 2. Re: minification strategies
    Jay Balunas Master

    I linked up some jira's that are related to this in the forum thread.

     

    Some thoughts:

     

    • We don't want to over complicate the quickstart
      • The aerogear examples is where we can get more creative, prototype, and develop our RI's
      • Showcase different approaches etc...
    • The primary consumer of the quickstarts are going to be Java developers imo.
      • Just something to keep in  mind
    • We still want to show value in minification though
      • It is so important to performance

     

    The most straight forward approach might be something like in AEROGEAR-62.  Some plugin for the maven build, this is easily consumable, and may do the job.  I've not looked into the details of the wro4j plugin, and there may be better ones out there, but something we should consider.

  • 3. Re: minification strategies
    Wesley Hales Master

    Some research I have done on the topic: (please add more as this could become a wiki page)

     

    Server Side Proxies and Libraries

    JAWR

    http://jawr.java.net/

    Jawr is a tunable packaging solution for Javascript and CSS which allows for rapid development of resources in separate module files. Developers can work with a large set of split javascript files in development mode, then Jawr bundles all together into one or several files in a configurable way.

    By using a tag library, Jawr allows you to use the same, unchanged pages for development and production. Jawr also minifies and compresses the files, resulting in reduced page load times.

    Jawr is configured using a simple .properties descriptor, and aside of standard java web applications it can also be used with Facelets and Grails applications.

    Ziproxy

    http://ziproxy.sourceforge.net/

    Ziproxy is a forwarding, non-caching, compressing HTTP proxy targeted for traffic optimization. It minifies and optimizes HTML, CSS, and JavaScript resources and, in addition, re-compresses pictures.

    Basically, it squeezes images by converting them to lower quality JPEGs or JPEG 2000 and compresses (gzip) HTML and other text-like data.

    It also provides other features such as: preemptive hostname resolution, transparent proxying, IP ToS marking (QoS), Ad-Blocker, detailed logging and more.

    Ziproxy does not require a client software and provides acceleration for any web browser, any operational system.

    JavaScript Minification

    JavaScript and CSS resources may be minified, preserving their behavior while considerably reducing their file size. Some libraries also merge multiple script files into a single file for client download. This fosters a modular approach to development and limits HTTP requests.

    Google has released their Closure Compiler, which provides minification as well as the ability to introduce more aggressive renaming, removing dead code, and providing function inlining.

    In addition, certain online tools, such as Microsoft Ajax Minifier, the Yahoo! YUI Compressor or Pretty Diff, can compress CSS files.

    JSMin

    http://www.crockford.com/javascript/jsmin.html

    JSMin is a filter which removes comments and unnecessary whitespace from JavaScript files. It typically reduces filesize by half, resulting in faster downloads. It also encourages a more expressive programming style because it eliminates the download cost of clean, literate self-documentation. It’s recommended you use JSLint before minimizing your JavaScript with JSMin.

    Packer

    http://dean.edwards.name/packer/

    Packer, for instance, can optionally Base64 compress the given source code in a manner that can be decompressed by regular web browsers, as well as shrink variable names that are typically 5–10 characters to single letters, which reduces the file size of the script and, therefore, makes it download faster.

    JavaScript Build Tools

    grunt

    https://github.com/cowboy/grunt

    Grunt is a node based task-based command line build tool for JavaScript projects.

  • 4. Re: minification strategies
    Douglas Campos Newbie

    There a couple of small drawbacks. One, it is still in beta so there may be issues but the people I have talked to that use it, love it. Second is that it requires Node.js to run. I don't think this is a big deal but it does require some setup outside of the project. This could be solved with a little bit of documentation or we could look into offering a few options that people could choose from to handle this process and they could choose what ever they may be more comfortable with.

     

    Knowing that our main audience are java developers, IMO we should avoid anything that is node-specific, and case this is not possible, making it work with any java js runtime.

  • 5. Re: minification strategies
    Kris Borchers Newbie

    I started looking at wro4j and am thinking it may be the solution we want. The Maven plugin version of it can do linting, minification and concatenation during the build process. This is exactly what I was looking for with Grunt but without the Node.js dependency. I am no Maven expert but have worked with it before so I am going to take a stab at integrating the wro4j plugin into the kitchensink quickstart and see if I can get it going.

  • 6. Re: minification strategies
    Jay Balunas Master

    That would be great, and what I was hoping for from my quick read through.  Lets discuss this more at the team meeting today, including any progress or question you may have.

     

    This may also help with AEROGEAR-124 discussions about single page resources.