Caching specific Javascript and CSS files

Question

How can I cache a few specific JavaScript & CSS files. I found advice from this site to put this in my .htaccess file

AddOutputFilter DEFLATE css js
ExpiresActive On
ExpiresByType application/x-javascript A2592000

But it is incomplete. What is .htaccess and how do I create it, where to store it, in my web root folder?

What is the meaning of the following statements:

AddOutputFilter DEFLATE css js
ExpiresActive On
ExpiresByType application/x-javascript A2592000

I dont want to cache all my Javascript & CSS files rather just a few specific files which will never change.

How can I do this?

Answer 1

You can configure IIS to cache specific files by extension. For example:

Select the folder where your css/js files reside and then click on Output Caching.

Then add the file extensions that you want to cache:

I don't think you can specify which ones to cache on a per file basis unless you write an http handler module to add the appropriate headers for each file independently, but from IIS this is how is done.

Then you can verify that you are getting 304 responses using firebug / fiddler or your tool of choice.

I hope this is helpful.

Answer 2

That's cool i would anyways add a file revisions and make IIS cache css + js files. As Icarus specified.

Then if you update the files on the server just add a new revision number this could also be a timestamp.

• http://particletree.com/notebook/automatically-version-your-css-and-javascript-files/
• http://davidwalsh.name/prevent-cache (just the opposite)
• http://betterexplained.com/articles/speed-up-your-javascript-load-time/
• http://www.die.net/musings/page_load_time/
• http://ajaxpatterns.org/Patterns#Performance_Optimisation