I'm trying to figure out a way to cache images in browser memory. I tried saving their base64 representation in local storage as follows:
fr.readAsDataURL(blob)
fr.onloadend = () => {
const base64 = fr.result
localStorage.setItem(today.toDateString(), base64)
}
However, I'm getting the following error:
QuotaExceededError: Failed to execute 'setItem' on 'Storage': Setting the value of 'Wed Sep 29 2021' exceeded the quota.
How can I accomplish this?
The most you can use in localStorage is 5mb, which honestly if your images are that size it's going to be a bad user experience.
You should let the browser cache automatically where it needs to, especially for media content they're really clever at that already.
Base64 I can see being a problem, is there a reason you can't provide a URL instead?
