When a user visits a webpage, which contains an image, the browser will first check if it has the image in it’s cache. If it does, it will ask your web server if it has a newer version. If there isn’t a newer version, then the browser doesn’t download the image again, and instead displays it using its cached version. That’s very nice, because you do not have to send the image to the user again, but the web server has had to do a little work by checking the last time the file was updated. You can stop the browser asking so frequently by using a cache control header. This basically tells the browser not to ask if there is an updated version until a certain amount of time has passed. One way of setting this cache control up is using a .htaccess file. This assumes that you are using Apache.
The following example tells the browser to cache any gif, jpg, or png files for 1 month:
<IfModule mod_expires.c> ExpiresActive On ExpiresByType image/gif "access plus 1 months" ExpiresByType image/png "access plus 1 months" ExpiresByType image/jpg "access plus 1 months" </IfModule>
Alternatively, you could use the following, which caches anything with the listed extension for 1 day
<FilesMatch "\.(ico|pdf|jpg|jpeg|png|gif|js)$"> Header set Cache-Control "max-age=86400" </FilesMatch>
I personally use the final example, because it’s easier to list the file extensions, rather than listing the mimetypes.