Thursday, May 22nd, 2008

PersistJS: Cross Browser Client-Side Persistent Storage

Category: JavaScript, Storage

>Paul Duncan announced today the release of PersistJS, a client-side JavaScript persistent storage library.

Currently the only reliable cross-platform and cross-browser mechanism for storing data on the client side are cookies. Unfortunately, using cookies to store persistent data has several problems:

* Size: Cookies are limited to about 4 kilobytes in size.
* Bandwidth: Cookies are sent along with every HTTP transaction.
* Complexity: Cookies are difficult to manipulate correctly.

Modern web browsers have addressed these issues by adding non-Cookie mechanisms for saving client-side persistent data. Each of these solutions are simpler to use than cookies, can store far more data, and are not transmitted along with HTTP requests. Unfortunately, each browser has addressed the problem in a different and incompatible way.

Trying to address the need for client-side storage sans browser-specific techniques or browser plugins, Paul has created an abstraction layer that allows developers to use most of the most common client-side storage mechanisms via a common interface. It currently supports persistent client-side storage through the following backends:

  • flash: Flash 8 persistent storage.
  • gears: Google Gears-based persistent storage.
  • localstorage: HTML5 draft storage.
  • whatwg_db: HTML5 draft database storage.
  • globalstorage: HTML5 draft storage (old spec).
  • ie: Internet Explorer userdata behaviors.
  • cookie: Cookie-based persistent storage.

Other notables features include:

  • Small (9.3k minified, 3k gzipped)
  • Standalone: Does not need any additional browser plugins or
    JavaScript libraries to work on the vast majority of current
    browsers.
  • Consistent: Provides a consistent, opaque API, regardless of
    the browser.
  • Extensible: Custom backends can be added easily.
  • Backwards Compatible: Can fall back to flash or cookies if no
    client-side storage solution for the given browser is available.
  • Forwards Compatible: Supports the upcoming versions of Internet
    Explorer, Firefox, and Safari (Opera too, if you have Flash).
  • Unobtrusive: Capability testing rather than browser detection, so
    newer standards-compliant browsers will automatically be supported.

Related Content:

Posted by Rey Bango at 2:46 pm
9 Comments

++++-
4.1 rating from 33 votes

9 Comments »

Comments feed TrackBack URI

dojox.storage has had a nearly identical architecture for a while now. Great to see others picking it up.

Regards

Comment by slightlyoff — May 22, 2008

The goal of Dojo Storage and PersistJS are the same, but the implementation is slightly different. In particular, Dojo Storage relies on Flash to provide persistent storage to browsers that PersistJS can target natively.

But you’re right, Dojo Storage was doing something similar in 2006 :).

Comment by pabs — May 23, 2008

Just try out http://www.thomasfrank.se/sessionvars.html. Its as easy as storing in cookies. I love it.

Comment by cyberer — May 23, 2008

sessionvars is only for sessions, right? Seems useless for persistent data.

Comment by Nosredna — May 23, 2008

Sounds good but how does this compare with Taffy DB, which is a lightweight client-side database.

Comment by Jordan1 — May 23, 2008

Taffy DB is really cool, but I think it onl;y works during a session. I think if you close the browser, the data is gone.

Comment by Nosredna — May 23, 2008

Any idea on how much this can store?

Comment by cnizz — May 24, 2008

pabs:

dojo.storage is opportunistic, it uses whatever substrates are available (including HTML 5 storage, userData, Flash, etc.) and the plugin system looks much like the one that PersistJS uses. You should check it out….like all of Dojo, it has continued to evolve in a sane direction (even if we didn’t make big noise about it).

Regards

Comment by slightlyoff — May 25, 2008

what the total storage on this system?

Comment by Tribulus — October 1, 2008

Leave a comment

You must be logged in to post a comment.