Moving our Data Saving to Mobile First

When I first began working on our app, it was mostly a proof of concept prototype. So I threw in a Firebase setup, and as we began testing out features, I used Firebase to save data as need be. I knew I’d have to rewrite this later, or users could end up without necessary data if they go offline mid stream. Also, it meant that every saved PNG had to be delivered from Firebase - when localStorage would be a far better way to serve those images.

Firebase does tout its “offline capabilities” but in the past I didn’t find that I could both save and retrieve data while offline. Perhaps they’ve improved this in the past year, but I don’t think it’s adequate for an offline solution. Articles here and there suggest that you

1- find a good offline/local browser based database
2- build a script to sync up data when the user goes back online

I found what looks to be a pretty awesome script in localForage, with over 9500 stars in Github it sounds like a few other people are using it… Setting it up was about as easy as I’ve ever seen, I didn’t even have to declare the DB in advance. Sweet. And at only 25KB for the minified JS file, that is nice and slim.

But the logic for an “offline” or “mobile first” setup is still something I’m working on. So far I think I’ll have the user save images and image definitions to both, then if they go offline, it will timestamp the localStorage and Firebase, and sync up any data once the user goes back online. I also have to divide the line between paid and free users - so that paid users get the benefit of cloud synced data, whereas the free users should probably only have the localStorage.