chrisben / imgcache.js

JS library based on the File API to cache images for offline recovery (target: cordova/phonegap & chrome)
Other
826 stars 216 forks source link

Question: permanent cache #168

Open amnonjw opened 8 years ago

amnonjw commented 8 years ago

Hi I really loved the concept and implementation of this library. I wish to ask for some clarification: when an image is cached - is it stored permanently in device storage? does that mean that the next time the app starts (for example a day later) the app looks for the image first in the local storage of the cache from previous runs, and if it's not there - it generates the GET request for the url?

and two follow-up questions:

thanks in advance

chrisben commented 8 years ago

The images should be permanently stored on the device storage, this is a default setting (ImgCache.options.usePersistentCache). You can then use the cached image as a fallback when an image fails to load (offline case) or you could replace all image sources from your document with those in the cache before they even try to send a GET request, on document load.

ImgCache.cacheFile could be used to cache anything you want, be it text or binary files. The rest of the API is more focused on images, so you would need to use (and maybe adapt a bit) Private.loadCachedFile to be able to use those files.

There's currently no mechanism to invalidate the cache. That's something I planned to do, by storing cache-related headers metadata along with the files in the cache. Though I'm not sure Cordova's FileTransfer would return http headers... ?

amnonjw commented 8 years ago

Thanks for the response, I hope to incorporate this library into my app in the next few days.

I'm not familiar with FileTransfer plugin and http headers, but I thought again about what I need regarding updating cached files. I might use a different mechanism to let the app know that files were changed (not push notifications, something else), instead of using http headers.

chrisben commented 8 years ago

If you can control when the images are updated, you could place on your server a json file listing all your images that need refreshing. This file would also need to contain a version number that you increment every time you update that file.

In your client code you can then go read this file, if a new version exists (last version read stored in localstorage), you read it and remove from the cache all images that are in this list, then run cacheFile again on all of them.

jamminjames commented 7 years ago

Question. Chrisben, you say, "You can then use the cached image as a fallback when an image fails to load (offline case) or you could replace all image sources from your document with those in the cache before they even try to send a GET request, on document load."

How do you set whether or not it uses the cached images before trying to send a GET request?

chrisben commented 7 years ago

@jamminjames What I meant with the GET request is the request the browser makes to download then display an image set via an img tag. On page load, in javascript, you can set those img tags to point to images in the cache instead. Is that clearer?