January 18th 2013
Why do this and not just use the browser’s cache? Because it’s faster, according to tests performed by both Google and Bing, both of which employ the technique on their sites now. Basket.js enables you to take advantage of the same technique in your sites and apps.
It works by first loading a small stub file (Basket.js itself) and then checking to see whether your other scripts are already cached in localStorage, and if not or if they are expired, loading them via XHR and caching for subsequent loads. Basket.js has a nice Promise-based API, using RSVP.js which allows you to require scripts and inject them into the page to execute.
It’s a fairly simple project, but implements a very useful idea. I’d love to see a FileSystem API based version as well to see how performance varies compared to localStorage. Apparently they’ve already tried IndexedDB and found it to be much slower than localStorage, which I found surprising. In either case, both the FileSystem API and IndexedDB are designed more for this use-case, and have much larger quotas than localStorage, so it would be useful to experiment with them both in the future.