Local storage vs AngularJS $cacheFactory

Question

I have a problem of storing a lot of client-side data, and I can't decide which way is better. Now I'm using AngularJS's cacheFactory, it works fine, but all data reloads with a new session. Is it worth to use local storage instead?

Solution 1

If your goal is to store client-side and persistent data, you can't use the $cacheFactory, which just caches the data for the current session.

One solution is to use the new local storage API. This awesome Angular module makes all the dirty job for you, and even falls back to cookies for old browsers!

Solution 2

An alternative solution is http://jmdobry.github.io/angular-cache/ which works well with ngResource and can also easily be configured to sync to localStorage, so requests don't need to be re-done after page refresh.

$resource('my/kewl/url/:key', { key: '@key' }, {
  'get': { method: 'GET', 
           cache: $angularCacheFactory('MyKewlResourceCache', { 
                                          storageMode: 'localStorage' })
         }
});

Solution 3

$cacheFactory seems to be clearly NOT your solution, because as Blackhole said, the cache will be cleared each time session expires. $cacheFactory is just a memcache implementation the Angular way.

angular-cache is just an helper API, basically it adds option to $cacheFactory and one of this option is to store cache into persistent storage (like localStorage).

So if you want to store data in persistent storage you can use use one of the module available like angular-local-storage or use $cookieStore but it will create cookies...