html5 to store greater than 50 mb worth of data?

Question

I am building a mobile app that must work in Blackberry, iPhone and Android phones. I am building this mobile app in HTML5, CSS and JQuery Mobile. Then I will use PhoneGap to allow the code to run as a native mobile app for the phone. The mobile app must be able to work without connection to the internet. The only time the app must require an internet connection is when it loads for the first time, because that's when the app will download over 50 MB worth of data. Next time the app has internet connectivity, it will poll the server for more recent data to consume.

My problem lies in where do I store 50 mb worth of data which can be updated when internet connectivity exists?

Additional Notes

I've been discouraged by others to use Web SQL Database because the specification is no longer in active maintenance. I've read that localStorage and cache manifest has a storage limit of about 3-5 mb depending on the browser. From experience, I've encountered a lot of challenges working with the PhoneGap API to create one set of code that will reliably write to all of the following file systems: ios, bb, android.

Answer 1

Based on your needs: (store 10,000 images, 10,000 pdfs, +videos etc.) I don't think a "lightweight" HTML5 application is going to suit your needs.

I think that a native application is likely going to work much better where you have proper filesystem access to store the files on the device as needed (and even structure them better).

The HTML5 localStorage (5mb) and the WebSQL (SQLLite) (5mb-~50mb) database options really won't give you what you need as far as I can tell.

WebApp "wrappers" like PhoneGap and WebWorks (for BlackBerry) will give you the filesystem access you need, but I'm not sure if either of them have limitations that you'll hit size/quantity wise... hopefully someone with experience in these wrapper frameworks can indicate any size limits they've encountered.