Redux-persist: Exceeding storage quota

Created on 18 Jul 2018  路  13Comments  路  Source: rt2zz/redux-persist

Hey there,

I'm encountering the following error, after running my app for a certain amount of time:
Failed to execute 'setItem' on 'Storage': Setting the value of 'persist:primary' exceeded the quota.

Has anyone seen this before? I presume the cached data is over the localStorage quota, but seeing the quota is 10mb for Chrome, I find pretty difficult to believe, unless something bizarre is going on.

Is there a means of perhaps console logging the total contents of the persisted store data?

Most helpful comment

Fix for Web:

$ yarn add localforage

import localforage from 'localforage';

const persistConfig = {
    key: 'root',
    storage: localforage,
};

All 13 comments

You can type localStorage and hit enter in your browser console. Alternatively you can view the Local Storage section of the "Application" tab in Chrome dev tools. Both methods will reveal the entirety of what is being held in localStorage for the current domain.

I got this same error.
screenshot 2019-03-01 at 10 02 37 am

I am also getting same error..How to clear local storage data programatically.?

any updates on this error?

@FrenchBully Hi u can use localStorage.removeItem(key);

@naisargparmar @dhwrwm @MitchEff did you get any solution for this.

Kind of. The storage limit obviously can't be changed, but if you're filling up your storage limit, there may be other causes.

We've found:

  • This is often caused by issues with Redux/Normalizr accidentally causing exponential memory leaks - some of our entities would have arrays of relationships with 100,000 of the same object, cause it's pushed/mutated every render, or something like that
  • Purging the persistor after logging in stops these things getting out-of-hand - once we've got a fresh set of data from the API, the persisted data is no longer relevant. If we clear it each time (and there's no normalization issues), it doesn't creep up in size.

Hope that helps. It's not a perfect answer, but if your localStorage is full, you've most likely done something wrong.

@prasanthyejje I am using localStorage.removeItem(key) to clear storage. or u can generate multiple different keys under localStorage.
Also @MitchEff said Storage limit can't be changed. so try to generate different keys under localStorage or clear storage.

try to limit the data that you are fetching, in my case I have 57 data that's why I set an offset and limit to make it 20 and then I added a load more button to load the other 20 and so on

any solution for this? I tried remove item , it didnt work

Fix for Web:

$ yarn add localforage

import localforage from 'localforage';

const persistConfig = {
    key: 'root',
    storage: localforage,
};

@yarokon .. Thanks .. that worked for me !!

thanks @yarokon

Was this page helpful?
0 / 5 - 0 ratings