Almost all the web applications that we are involved with will contain multiple javascript files and css files. Best practices suggest to keep the js and css files as much divided as possible during development time, for three main reasons – reduce individual page sizes, enable resuse and to leverage expiration policies on them.
Once published to production, again, for better front end performance, it is suggested that we: first minimize all these and then combine all these into one file each ( one for the js files and the other one for css files). There are many tools out there that allow you to do this – jsmin, YUI Compressor, CSSMin, MicrosoftAjaxMinifier. It is also advised that we do this during build time ( and that too only for release builds).
Wait a second, all these is the what we have now ( year 2011). What about 2012??? Well the King is back in the house – Visual Studio 2011 and with it the ASP.Net vNext (4.5 Dev preview). So, what?
With ASP.Net 4.5, all the above is inbuilt. Yes, you read it right. “Minification and Bundling” is part of ASP.Net 4.5 framework. No more running around external libraries and tools to get this done for you.
By default it is directory based. You keep all the css files and the js files in a specific directory and just link to that directory from your page using something like: <link href=”mystyles/css” rel=”stylesheet”> for CSS and <script src=”jscode/js” /> for JavaScript files – it is as simple as that. Rest is taken care by the ASP.Net framework – it minimizes all the files, bundles them together into one single file and then includes them as part of the http response.
The above is just the default behavior. The framework also provides extension APIs that you can use to create your own processing for the minification as well for the bundling. And all this you do at your most favorite place in the whole wide world– globasl.asax.cs :).
Enjooy!