Grails 1.4: The new Resources stuff

I’ve recently migrated one of my applications over to Grails 1.4M1 (mainly because I was busting to try out the new testing stuff that Peter was writing about). In the process, I had a chance to kick the tyres on the new resources infrastructure that Marc has baked into 1.4.

So what’s the verdict? The new Resources framework is jam-packed-full-of-awesome! This stuff has significantly reduced the amount of js/css dependency nightmares that I have been dealing in my view layer. Not only is there far less code to write, I can now migrate between versions of libraries without the drama of updating any of my ref links.

If, for no other reason, you need to jump on the new resource dependency freight train. The new resources infrastructure radically simplifies dealing with all your JavaScript and CSS files and their dependencies. If you’ve ever nicked any of those slick jQuery components you find on the web (or even if you’ve just tried to spark up jQueryUI), you know the pain that it is to include all those script tags all over your head section (and making sure you get them in the right order).

There’s only a few key concepts to learn:

• You can now define your resource components in a special configuration file (/grails-app/conf/MyAppResources.groovy)
• Resource definitions include their own dependencies (eg jQueryUI depends on jQuery)
• Consuming resources in your view layer is now a one-liner
• If you want to handle compressing, gzipping and caching of your resources later on, there are magic plugins.

First things first. Let’s say you want to include some jQuery component (such as this cute little growl library that I’ve been playing with for handling Grails messages). You’d normally copy the css into /web-app/css/growl and the js into /web-app/js/growl, then set about adding link tags into the pages that needed them. No more!

You now put all your resource definitions into /grails-app/conf/MyAppResources.groovy (or whatever you’d like to call it for your app, the convention needs to end in “Resources.groovy” though). Here’s a sample of what the file would look like:

modules = {
 growl {
        dependsOn 'jquery'
        resource url:'/css/growl/growl.css'
        resource url:'/js/growl/growl.js'
    }
}

The jQuery plugin is installed by default in Grails 1.4, hence we can already “depend” on in here. The definition above tells the resources system, that any time we include the “growl” resource in a page, pull in jQuery, and also pull in the growl css and js resources in appropriate ways.

The most minimal definition would be:

<r:require modules="growl"/>

And you’re done! Giddy up! (actually, you will need to tweak your sitemesh layout too, more on this shortly)

The resources plugin will do the hard work of pull in all the files you need (even bundling the deps together for a faster download with less http requests). Have to be happy with that!

You will need to change your main sitemesh layout to put in r:layoutResources tags in both head and body. The resources plugin makes smart decisions about optimising placement of your code (for example, putting your JavaScript files at the end of the page for performance). So add one of these to both the head and body of your :

<r:layoutResources/>

There’s plenty more to explore in the new infrastructure, so head on over to the detailed documentation which is already in the Grails 1.4 docs or deep dive into the Resources plugin docs to get the skinny on neat debugging support.