2009-11-23

Storing Persistent Data in Hybrid iPhone Webapps

I'm in the process of adding some persistence to a hybrid iPhone webapp. It looks like I'll be using the HTML5 Web Storage capability. I googled around and didn't find any comparisons of the alternatives or suggested best practices. Apple has a document called Safari Client-Side Storage and Offline Applications, which covers Key-Value storage and the JavaScript Database -- but makes no mention of hybrid applications.

It seems there are four possible options:
  1. Web Database
  2. Key-value storage
  3. Cookies
  4. Use a JavaScript to Cocoa bridge to access native persistence
I've given a little thought to the advantages and disadvantages of each (enough to decide to give HTML 5 Web storage a try.)  I'll update this document if I get any good feedback.


Web Database

Advantages
  • Can be used in hybrid, online and offline webapps.
  • Supported in iPhone OS 2.0 and later.
  • SQL is familiar and powerful for those who know it and need it.
Disadvantages
  • Use of SQL is overkill for simple persistence
Key-value Storage

Advantages
  • Simple conceptual model than SQL
  • Has both "session"and  "local"  modes
Disadvantages
  • Only supported in iPhone 3.0 and later (although Apple isn't very clear on this)
Cookies

Advantages
  • Tried and true web technology
Disadvantages
  • Either not supported in Hybrid mode or requires extra Cocoa code to support.  (Does anybody have a definitive answer, details, or an example?)
  • Extra data is transmitted to the server on each request
  • Others?
Custom JavaScript to Cocoa Bridge Option

Advantages
  • You can use any iPhone native mechanism for persistence
Disadvantages
  • Requires custom Cocoa code
  • JavaScript to Cocoa bridge options are fairly clunky
  • Will not work for pure online/offline webapp


10 comments:

  1. I found that HTML5 Web Storage is a bit unreliable in combination with iUI. In my own app I constantly had problems accessing the database after using the app for a while.

    It turned out that the URL hash trick for creating a page history for the back button screwed up the opened database. Only a complete reload of the page would solve the problem.

    Because I only use the app full screen and the back button isn't visible anyways, I hacked iUI to stop using the hash trick.

    ReplyDelete
  2. Great summary Sean.

    Have you had a chance to check out Lawnchair? http://brianleroux.github.com/lawnchair/

    It is a couchDB-esque client side JSON document store from one of the guys behind PhoneGap that should offer key-value persistence in any browser with SQLite support (i.e. Android and Safari on iPhone 2.x).

    ReplyDelete
  3. @Niels Yikes! Thanks for the heads up. Were you using "Web Database" (i.e. SQL) or "Web Storage" (i.e. localStorage/sessionStorage key-value)?

    ReplyDelete
  4. @Jeff No, I hadn't seen Lawnchair before. Cool stuff - thanks!

    ReplyDelete
  5. @Jeff I'm not sure it's a great summary as I haven't really tried any of the options yet - But it's the *only* summary that I know of...

    ReplyDelete
  6. BTW, Key-Value storage and Web Storage are the same thing by two different names:
    http://www.w3.org/TR/webstorage/
    http://developer.apple.com/safari/library/documentation/iPhone/Conceptual/SafariJSDatabaseGuide/Name-ValueStorage/Name-ValueStorage.html

    It is part of HTML 5, but is not widely implemented yet (even in the Webkit world)

    Quirks Mode testing is here:
    http://www.quirksmode.org/dom/html5.html#localstorage (Desktop)
    http://www.quirksmode.org/webkit.html#t016 (Webkit implementations)

    ReplyDelete
  7. @Sean I was using the SQL database.

    ReplyDelete
  8. This comment has been removed by the author.

    ReplyDelete
  9. Update: I'm using Web Storage (localStorage) in my app. The app runs on OS 2.2 and later. When localStorage is not present, the app falls back to a default setting. It seems to be working well in a final candidate and we should be submitting to the App Store any day now.

    ReplyDelete
  10. Thinking obout things I can do with iUI and googling "store data on iPhone from webapp" lead me here. Thanks for the leads.

    ReplyDelete