A Simple LocalStorage Model

1 minute read

I've been playing around with Google Chrome extensions again (you should too, they are really simple).

Chrome extensions at their most basic level consist of HTML and Javascript; allowing full utilisation of HTML5 APIs such as WebStorage, IndexedDb and everything else. Chrome sandboxes extensions just as it does with each tab you have open, so an extension follows the HTML5 requirements of only having access to it's own 'domain' of data.

When creating an extension, you'll likely want to store some data. The HTML5 WebStorage spec allows a site (or extension in this case) to store simple key value pairs. This is ideal for extensions looking to keep track of simple things such as user preferences. It shouldn't be used for complex data or data that you'll be expecting to search over. Use IndexedDb for that.

The following is a simple mechanism which can be used in an extension to store and retrieve data using localStorage. It provides no data validation or verification other than returning null if no data is found and storing values as JSON.

Stored properties are added by calling the settings.implement function. The function will take any number of parameters, so additional properties can be added with ease. Properties are checked to see if they already exist before being created.

As the model is in Javascript, it can of course be utilised by any web page as well :-)

Leave a Comment

Your email address will not be published. Required fields are marked *