Suitable data structures for saving files to localStorage (HTML5)?

Question

It’s good when there is no database support and users for authentication. My professor asked me to transform a recent research project that uses Bespin and calculates the mistakes made by users in the code editor as part of his research.

The goal is to fully convert from localStorage MySQL to HTML5 localStorage . It doesn't seem like it's that hard to do, although digging into its code may take some time.

Question:
I need to save files and state (last place of cursor and active file). I have already done this by following the recommendations in https://stackoverflow.com/a/2129608/ . But I would like your input to take into account how to structure the content for use.

My current solution> Hashmap type solution with javascript objects:

 files = {}; // later, saving files[fileName] = data; 

And then save to localStorage using some guidelines

 localStorage.setObject("files", files); // Note that setObject(key, data) does not exist but is added // using Storage.prototype.setObject = function() {... 

I am also currently considering using some type of numeric identifier. So the names can be changed without any problems renaming the key in hashmap. What is your opinion on how it is solved, and you would have done it differently?

Answer 1

I have currently decided, after some readings and research, that the best way is to store all objects using object literals:

 var files = {}; // Add loads of data 

Then save them using JSON.stringify() :

 localStorage.setItem('myFiles', JSON.stringify(files)); 

This makes good practice because it stores large amounts of information that is easy to store and receive. In addition, this prevents confusion when using the simple way to add key-value information to localStorage and when to use the localStorage.setItem(key, value) function