CODEWITHSUNDEEP
javascripthtmlcordovagoogle-chrome-app
Piotrek
Piotrek

Reputation: 11221

HTML5 app - where to store data?

I'm making simple app. I want this app to work on any device. It will be working as normal web app, android/ios app (ported using PhoneGap) and as Chrome App.

The problem is, I really don't know how to store data, so it could work properly on any above devices. I heard about localStorage and it seems nice but it reportedly has 5MB size limit and I'm not convinced that it will be enough (ok, maybe it will be enough for simple todo/notes app (what i'm making) but I don't know how my app will look like in the future and it will be hard to switch from localStorage).

What should I use?

Upvotes: 2

Views: 222

Answers (3)

mmocny
mmocny

Reputation: 8855

If you want to write a Chrome app, take a look at chrome.storage.local. It's not bound by low limits like local storage, which is disabled anyway.

Also, if you want both a PhoneGap and Desktop Chrome App, perhaps take a look at the cca tool which enables running chrome packaged apps on mobile using apache cordova

Upvotes: 0

broofa
broofa

Reputation: 38151

If LocalStorage will meet your immediate needs, I'd say go ahead and use that.

Don't worry (yet) about whether or not you'll need something more durable in the future. Migrating data out of LocalStorage and into some other backend service isn't that big a deal... and you're app may never get to the point you need to do that. I.e. this is a good problem to have.

Also, if you want your app to work offline, you'll likely need to use LocalStorage for client-side caching regardless, even if you want the user's data stored on a server somewhere.

Upvotes: 2

Zach Spencer
Zach Spencer

Reputation: 1889

I have seen lawnchair used in phonegap and it seems pretty good.

I found this example here:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="http://brian.io/lawnchair/downloads/lawnchair-0.6.1.js"></script>
</head>
    <div id="data"></div>
<body>
<script type="text/javascript">
    var store = new Lawnchair({
        adapter: "dom",
        name: "testing"
    }, function(store) {
    });

    store.exists('dhaval', function(available){
        var preStr = "";

        if(available){
            preStr = "key is already available, ";
        }else{
            preStr = "key not available, ";
            // create an object
            var me = {
                key: 'dhaval'
            };

            // save it
            store.save(me);
        }

        // access it later... even after app restart!
        store.get('dhaval', function(me) {
            $("#data").html(preStr + JSON.stringify(me));
        });
    });
</script>
</body>
</html>

Upvotes: 0

Related Questions