Self caching offline website Home

This is the demo for the tutorial Create a self caching website ready for offline usage with HTML5 and jQuery .

How does this demo work?

A self caching offline website? Great working title!

This javascript driven website will cache all pages you visit, including all linked javascript and stylesheet assets. The cached content will be saved in HTML5's localStorage.

With a minimal usage of HTML5's Application Cache all pages you visited online will be available offline too. Restored from localStorage.

Try it

  • Browse around.
  • See the Cached files list (to the right) grow.
  • Unplug the internet. Yeah, really! Or use Firefox in offline mode.
  • Reload the page, with the very same URL you used for online browsing.
  • See no difference? Good. Because you look at a cached and restored offline copy of the file.
  • If you run into a non-cached page you will see the content of the fallback file offline.html.

Browser support

This has been tested successfully in the latest versions of Chrome, Safari and Firefox. It also works with the browser that comes with Android 2.2.

Cached files

Trigger New Cache