Sunday, December 07, 2008 1:50 PM
Please check this post, it is the successor to this post. Thank you.
I have updated sss.aspx to include a couple of more features and here is what it can do for you now.
- The most important benefit is it allows you to combine several script files (CSS or js) into one file to return to your client, this helps increase performance of your website by minimizing the http requests the page requires.
- The returning stream tries to use GZip compression if supported by the client browser. This further increases load speeds of your site.
- You can specify default script files to include always.
- Proper cashing headers and proper generation of 302 response codes (not modified) to minimize the transfer of scripts to the client browser. Script files are sent back to the client browser only if they have been modified. Two headers are processed to achieve this, "If-Modified-Since, Last-modified" and "If-None-Match, ETag".
- The ability to process your script files on the server to modify them before you send them back to the client (server side scripts), for example, your css files could have two colors replaced by variables [[COLOR1]], [[COLOR2]] and these variables could be replaced with the actual colors that you want to send to the client browser when requested. Using this you could achieve things like custom css files per client account (custom colors for each client account), or it could be used to specify different strings (inside JavaScript files) depending on the current language set.
- Last, but not least, a feature I am enthusiastic about. You can put special comments in your css, js files to indicate file dependencies. If for example you have two javascript files common.js and popups.js. If popups.js depends on common.js then you write a special comment in the beginning of the popups.js file to indicate that common.js is needed. sss.aspx properly parses this "dependency tree" and combines the files properly, in the proper order and serves them back to the client browser. If you have a lot of javascript files, you know you have the headache of specifying them in the correct order in the html/aspx files. If you "describe" your dependencies correctly in all your files by including these special comments, then you will not have to worry about this anymore, when you specify a javascript file that you need, the scripts it depends on are automatically added.
To use sss.aspx, it is very simple.
1. add the file sss.aspx it to your site (no need to recompile).
2. instead of including your script files like this:
<script language="javascript1.2" src="common.js" type="text/javascript"></script>
<script language="javascript1.2" src="sample.js" type="text/javascript"></script>
<script language="javascript1.2" src="engine.js" type="text/javascript"></script>
Add this now.
<script language="javascript1.2" src="sss.aspx?sample.js,engine.js" type="text/javascript"></script>
Note how the file common.js was omitted from the list, this is because the files sample.js and engine.js start with the comment:
/* <sss include="common.js"/> */
This comment will make sss.aspx combine the file common.js with sample.js and engine.js in the proper order and serve them back as one file.
If you have any comments, please let me hear about them. I tried to be straight to the point in this post, if some things are not clear enough, let me know and I will gladly explain more. You can use fiddler2 (http proxy debugger) to check the results of using sss.aspx.
Another important tip for increasing your site's load speeds is to enable "Content Expiration" in IIS.
Download the latest sss.aspx file here