html5 appcache adding/removing specific files

Question

Say I have a simple appcache manifest that looks like:

CACHE:
# v1
# images
images/one.jpg
images/two.jpg
images/three.jpg

I then use some server side method to update the manifest to:

CACHE:
# v1
# images
images/one.jpg
images/two.jpg
images/three.jpg
images/four.jpg

And then call a function client side to update the appcache:

function updateCache(){ 
    var appCache = window.applicationCache;

    appCache.update(); 

    if (appCache.status == window.applicationCache.UPDATEREADY) {
        appCache.swapCache(); 
    }
}

I would like to 'add' my new image to the existing cache without downloading everything again (which is what's currently happening). Is this possible or am I missing something fundamental?

Answer 1

It will download everything again, that's the way it's designed to work. However if you have set far future expiry headers on your images then the chances are the browser will fetch them from the local browser cache rather than requesting them off the server again.

Note that if you do this during development this can lead to some strange behaviour, but you should definitely do it for production sites.