1

So we have this web image gallery we are working on. We are planning an architecture that is similar to this:

1 - Download all images from the server and store it in the local storage (HTML5)

2 - Display in gallery as if it were rendered from local drive

3 - Store any edits done in the gallery in local drive

4 - Upon clicking Completed button, upload all the change information into remote server

The images will have a higher count, like maybe in the thousands. I wanted to check if the above is do-able.

The team working on this project says that HTML5 local storage is of no use in context. They state that downloaded images are always going to reside in the cache and it will cause performance degradation in any case, and it cannot be helped.

Is that true? Is there anything that can be done using new HTML5 options to optimize this work flow?

Undefined Variable
  • 4,196
  • 10
  • 40
  • 69

1 Answers1

0

Theoretically you could base64 encode the images and store the resulting string in local storage. The only reason to do something like this, though, is to persist the edited image in an "offline" mode whereby they can close and reopen their browser without losing any of the changes they made. Otherwise these edits could be stored in memory and, once a user was finished, could then be persisted back to the server.

As for the original images themselves, your team members are correct, once the file has been downloaded, the browser won't attempt to fetch it again unless the expiration date in the header has lapsed.

EDIT

Found a link to another stackoverflow post describing the process:
How to save an image to localStorage and display it on the next page?

Community
  • 1
  • 1
THEtheChad
  • 2,372
  • 1
  • 16
  • 20