It’s been a while since I’ve last posted here. Nevertheless, I’ve been busy working on some (yet to be released) Open Source projects. Others are already released but not documented/promoted yet. One of these unpromoted releases is the new version of wicketstuff-merged-resources. wicketstuff-merged-resources was the result of my “Wicket Interface Speed-up” series where I investigate how to reduce time spent rendering Wicket pages on the client side. wicketstuff-merged-resources has two main purposes: reducing the number of HTTP requests by merging resources (i.e. JS and CSS files) and enabling aggressive caching (up to a year) by adding a version number to mounted resources (e.g. /css/all-42.css instead of /css/all.css). While wicket has the option to add a timestamp to references (something like /css/all.css?t=20090924), adding the version to the name is preferred over adding a query string. This said, let’s see how to use wicketstuff-merged-resources’ new version.
The main class now is ResourceMount which replaces the deprecated ResourceMountHelper (already removed in trunk version). Mounting is now much simpler. Just see this example:
ResourceMount mount = new ResourceMount() .setResourceVersionProvider(new RevisionVersionProvider()) .setPath("/style/all.css") .addResourceSpecsMatchingSuffix(PanelOne.class, ComponentB.class, MyForm.class) .mount(this);
Note that you still use the resources as you are used to, e.g.
This example simply mounts PanelOne.css, ComponentB.css and MyForm.css into a single file at /style/all.css (the suffix “.css” is determined from the path – “/style/all.js” would mount all “.js” files). Additionally, the RevisionVersionProvider is used to determine which version to append (you may implement your own IResourceVersionProvider that best fits your environment). For example, the merged file may be mounted at /style/all-42.css (while still being available at /style/all.css through a permanent redirect).
While ResourceMount tries to autodetect most properties of the merged resource (e.g. style, locale, compression) it comes with a ton of customization options. For instance, it’s possible to use a custom IRequestTargetUrlCodingStrategy. Doesn’t that sound interesting to you? Well, we used this option to upload all resources to Amazon Simple Storage Service/CloudFront in order to transparently leverage Amazon’s CDN by simply mounting them in our applications (Isn’t that awesome? Stay tuned for another blog post!).
Jörn Zaefferer suggested adding wicketstuff-annotations-like mounting of (merged) resources using annotations, which will hopefully be added in a later version. In the meantime, I may provide Jörn’s solution for those interested (Jörn, you don’t mind, do you?) – just leave a message.
Additional feature include CSS compression using Yahoo’s YUI Compressor and resource preprocessing. The later is particularly interesting, as you might implement things like replacing colors in CSS files or add internationalization from .properties files to JS files – just implement the IResourcePreProcessor interface (or use StringResourcePreProcessor if your only dealing with Strings).
I think I’ve mentioned the most important features now. Just see wicketstuff-merged-resources in WicketStuff’s Wiki for more (and possibly up-to-date) documentation. If you have any questions, don’t hesitate to post a comment!