Guidelines for web site optimization
- Put all your CSS in separate .css files
- Put your CSS links as early in the header section of the page as possible
- Minify your CSS files, i.e. remove whitespace etc.
- Try combining all of your CSS files into one
- If possible try loading large scripts asynchronously
- Set far future expire headers on your static content
Microsoft Ajax Minifier
However, being a pragmatic .NET developer, I chose the most easily accessible tool available for me, which is Microsoft’s Ajax Minifier. It’s a free tool available on Codeplex and documentation is provided on the www.asp.net site.
Ajax Minifier comes as a command-line application and after you have installed it you can use it through it’s own command prompt.
- ajaxmin inputfile.js –out outputfile.js
then add –clobber if you wish to override the outputfile.js if it exists, as in:
- ajaxmin inputfile.js –out outputfile.js –clobber
Minifying a single CSS file is equally simplistic as follows:
- ajaxmin inputfile.css –out outputfile.css –clobber
As before, add –clobber to override any existing output file.
Unfortunately there are no documentation on the asp.net site about how to combine multiple files into one, however, the ajaxmin command itself provides a hint given the /? parameter:
As an alternative to the input file parameter you can use the –xml parameter and supplying it with the path to an xml file of the following format:
<?xml version="1.0" encoding="utf-8"?>
The Ajax Minifier will combine all of your input files into one, minify it, and produce the result in the output file. Using this approach you can also control in what order the files are loaded into the page and sort out any dependency issues, just as you would, had you listed includes in the regular html file (or .master or whatever).
- ajaxmin –js –xml jsxmlfile.xml –clobber
- ajaxmin –css –xml cssxmlfile.xml –clobber