Over a million developers have joined DZone.
{{announcement.body}}
{{announcement.title}}

Easier IndexedDB with IDBWrapper

DZone's Guide to

Easier IndexedDB with IDBWrapper

· Web Dev Zone
Free Resource

Add user login and MFA to your next project in minutes. Create a free Okta developer account, drop in one of our SDKs to your application and get back to building.

If you're excited about IndexedDB but don't want to learn all its intricacies on your own, and don't want to wait for tutorials to walk you through every step slowly, then you might enjoy this wrapper for IndexedDB, just released by Jens Arps.

IDBWrapper has two purposes, says Jens:

a) ease the use of indexedDB and abstract away the differences between the existing impls in Chrome and Firefox (yes, it works in both), and

b) show how IDB works. The code is split up into short methods, so that it's easy to see what happens in what method.

The wrapper makes IndexedDB work a little more intuitively, which accomplishes both purposes.

For example, here's how IDBWrapper defines a put() function:

	put: function(dataObj, onSuccess, onError){
// TODO: Check for missing keyPath property.
onError || (onError = function(error) { console.error('Could not write data.', error); });
onSuccess || (onSuccess = noop);
if(typeof dataObj[this.keyPath] == 'undefined' && !this.features.hasAutoIncrement){
dataObj[this.keyPath] = this._getUID();
}
var putTransaction = this.db.transaction([this.storeName], this.consts.READ_WRITE, 1000);
var putRequest = putTransaction.objectStore(this.storeName).put(dataObj);
putRequest.onsuccess = function(event){ onSuccess(event.target.result); };
putRequest.onerror = onError;
},

For me, at least, this helps translate existing JavaScript intuitions to the new features of IndexedDB. (I personally prefer jumping in like this, albeit with translation, rather than stepping through a linear tutorial.)

The rest of the code is similar, and worth reading for self-educational purposes, even if you don't actually download and use it.

Check it out on github here.

Launch your application faster with Okta’s user management API. Register today for the free forever developer edition!

Topics:

Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}