I'm using AngularJS and I'm developing SPA. My goal was to provide offline brwosing. JSON data can be easily stored in js variables, images can be cached in Image objects.
So now I'm wondering.. if one person goes offline and tries to browse the content, what will happen?
1) the browser can't load the image because, being offline, it can't check what is the most-recent version of the image (the one cached or the one online)
2) the browser finds a reference for the image in the cache. The cached image is loaded even if the browser can't check the online image for the most-recent version
NOTE: THIS IS NOT A DUPLICATE QUESTION.
The fact I'm using Angular doesn't matter for the problem. There will be other people using other frameworks and looking for a general solution.
Secondly.. those answers just points out to use HTML5 and service workers. Things not related to AngularJS.
The unsatisfactory, but honest answer is "it depends". Unless you use specific instructions by listing your image in an AppCache or ServiceWorker, the browser cache may or may not show your images. Older browsers showed the HTML document and the content it had when you opened the file offline, but browsers that do have features like the ones mentioned are more aggressive in telling you that you are offline and will not show the page at all. The reason is that browser makers could not guarantee a good experience so instead of showing a document that may or may not display the images you get a "you are offline" message.
You can instruct browsers to cache images for a long time, which increases the likelihood of them being displayed https://developers.google.com/speed/docs/insights/LeverageBrowserCaching but there is no clean way to instruct the browser not to look for a newer version of them unless you specify it in AppCache or a ServiceWorker.