In my last post about the vagaries of Internet Explorer, I touched upon a technical solution we’d implemented to get Internet Explorer respecting our cache directives.
As we are using Apache, its mod_expires module should be loaded with which we can specify for how long the user agent should cache the images. In this case we use a LocationMatch to specify the paths as a regular expression to where our assets are located:
<LocationMatch "^(/path/to/images|/another/path/to/images)">
FileETag All
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image/jpg "access plus 14 days"
ExpiresByType image/jpeg "access plus 14 days"
ExpiresByType image/gif "access plus 14 days"
ExpiresByType image/png "access plus 14 days"
</IfModule>
</LocationMatch>
In this instance, we’re telling the client to cache jpg, png and gif images for 14 days and we are also ETag-ing these files – another useful measure to force the point on IE.
Even with this in place, it wouldn’t be Internet Explorer without having to deal with yet another of its quirks. If you gzip or deflate content in Apache but exclude images from this compression (for obvious reasons), Internet Explorer will refuse to cache those uncompressed images if a Vary header is being sent to the client. Luckily both mod_gzip and mod_deflate have workarounds for this :
mod_deflate (for Apache 2)
SetOutputFilter DEFLATE SetEnvIfNoCase Request_URI \.(?:gif|jpe?g|png)$ no-gzip dont-vary SetEnvIfNoCase Request_URI \.(?:exe|t?gz|zip|gz2|sit|rar)$ no-gzip dont-vary
mod_gzip (for Apache 1.3)
mod_gzip_on Yes mod_gzip_send_vary Off mod_gzip_dechunk Yes mod_gzip_item_include file \.(html?|txt|css|js|php)$ mod_gzip_item_include mime ^text/.* mod_gzip_item_include mime ^application/x-javascript.* mod_gzip_item_exclude mime ^image/.* mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*
The relevant entries here that turn off the Vary header are “mod_gzip_send_vary Off” for mod_gzip and “dont-vary” for mod_deflate. You’ll know it’s working when you start seeing Expires, Cache-Control and no Vary headers when requesting images in the relevant locations.
With this in place, Internet Explorer speeds up no-end! The flip-side of that from a development point-of-view is that more people will hang on to their crusty old browser for longer. Patience is required for the next 6 months or so.