After yet another day of being distracted WAY too much by twitter, I recall a tweet that Paul Cowan posted:
“what are people using to combine all their .js files into 1?”
Now I had no idea how people we doing this but, ironically, this is functionality that I will require myself shortly. What I did know though was that the kind people at Google recently released their JavaScript closure compiler a tool that cleans, optimizes and minifys your .js scripts. This library is available as either a downloadable command line tool, or via a RESTful API.
So, for the purpose of testing this library (and given the fact that Mads Kristensen has created a small wrapper around it) I opted to play with the RESTful API. My aims were to build a quick and dirty HttpHandler around this library that would mash all my .js files together, send them to be complied and stuff the results into the cache.
With this in mind I give you my 15 minute spike: www.dotlesscss.com/mashpotato.zip
If you download this solution you’ll see a web project that references my HttpHandler and has the following config section:
<add verb="GET" path="*.mash" validate="false" type="MashPotato.Core.ClosureHttpHandler, MashPotato.Core"/>
This configuration allows me to add “.mash” file in the same folder as my scripts which contains a list of newline separated names of the JavaScript files to be mashed together i.e.
Looking in scripts.mash you’ll see:
Now simply reference the .mash file like any other JavaScript files and you should get the mashed, compiled, optimized of the referenced file i.e:
<script src="../../Scripts/scripts.mash?cache=true" type="text/javascript"></script>
Also, notice the “cache=true” uri parameter… guess what this does?
Issues:
I’d say there’s likely to be hundreds of issues as it took me approximately twice as long to write this blog post than to write the handler, but off the top of my head here goes:
- Googles RESTful API has a size limit of the amount of data that can be posted to it so no mashing up your large framework scripts like JQuery.
- Obviously, the console application should perform much better than the RESTful API
- I don’t know, it took me 10 mins I’m sure it’s buggy as hell.
Hey Chris,
Here’s my post on the subject of “squashing”/”mashing” javascript files in Asp.Net MVC: http://www.weirdlover.com/2010/05/08/caching-javascript-and-css-files-in-asp-net/. You can modify/minify/cache the js files however you see fit. It also works for .css and .txt files, and it’ll work for .less files soon enough. 🙂
Let me know what you think!