Memoization of jQuery's $.getJSON() to use localStorage for caching.

getCache.js

var getCache = function(url) {

  var supportsLocalStorage = 'localStorage' in window;

  // Both functions return a promise, so no matter which function
  // gets called inside getCache, you get the same API.

  function getJSON(url) {

    var promise = $.getJSON(url);

    promise.done(function(data) {
        localStorage.setItem(url, JSON.stringify(data));
    });

    console.log('%c' + url + ' fetched via AJAX', 'color: orange');

    return promise;
    
  }

  function getStorage(url) {

    var storageDfd = new $.Deferred(),
        storedData = localStorage.getItem(url);

    if (!storedData) {
      return getJSON(url);
    }

    setTimeout(function() {
      storageDfd.resolveWith(null, [JSON.parse(storedData)]);
    });

    console.log('%c' + url + ' fetched via localStorange', 'color: blue');

    return storageDfd.promise();

  }

  return supportsLocalStorage ? getStorage( url ) : getJSON( url );

};

usage.js

// Instead of using jQuery's $.getJSON('foo/bar.json'), use getCache('foo/bar.json').

// first time uses an ajax request
getCache('foo/bar.json').then(function (data) {
  console.log(data);
});

// second time pulls from local storage
getCache('foo/bar.json').then(function (data) {
  console.log(data);
});

// always executes in asynchronous order, uses ajax always if localStorage isn't supported.

I have to try this. Thanks for the gist.

---

...just tried. It works great! I'm using it here:
https://jsfiddle.net/gemmadlou/fez69ggg/

I've left your console.logs on - thanks again.