Android and iOS are clearly the market leaders when it comes to mobile OSs but there are three things they both need to do to show support for web apps.
- localStorage persistence
- AppCache persistence
- JS APIs for device functions
localStorage and AppCache persistence
In a flickering dream, I’d once believed this would work; when saving a link to a web app (particularly on iOS with it’s “Add to Homescreen” function) that web apps’ localStorage and AppCache data should be protected from a regular cache clear, so when you attempt to clear your browser cache you should be asked whether you’d like to retain offline app data.
This means that a web app, saved to your homescreen, would have persistent storage without requiring libraries like PhoneGap to provide them — we already use so many libraries we need libraries to manage our libraries so I don’t think we should encourage the use of another when built-in beats bolt-on any day (which I think was a quote from Bruce Lawson).
If you’ve completed the task of saving a specific web app to your device for easy access, the device should protect that app’s data and treat it as something more valuable than data for a website because you’re saying “I want to save this web app for easy access so I can use it any time”…the “use it any time” is crucial.
I tested this on a few devices — it failed (it was expected to) but at least it was tested. If you’d like to repeat my epic fail of an experiment:
- Visit my localStorage AppCache mobile test page on your mobile device
- “Save to Homescreen” or save a shortcut on your launcher
- Clear your browser cache to start from a blank slate
- Visit the page using the shortcut — this will store a single localStorage key-value pair as well as an image in AppCache
- Expected: “localStorage not found” (meaning there isn’t a key there, so create one) and image displayed
- Clear your browser cache and disconnect from the internet
- Visit the page using the shortcut once more
- Hypothesis: “localStorage found” will be displayed along with the image, showing that the data had been preserved despite clearing the cache
- Null hypothesis: “localStorage not found” will be displayed and a red box will show
On Android 4.3, 4.4 and 4.4.2 as well as iOS 6 and 7, the null hypothesis was correct.
JS APIs for device functions
- Phone book
- SD Card
- Music library
Sure, PhoneGap and similar technologies allow access to these, but it’s still just a web page in a native app — not a true web app. I’ve used PhoneGap to implement a few of these features and while it’s incredible that it’s possible with only HTML, CSS and JS knowledge it still falls short of real support for developers from the people that make the devices and/or operating systems.
What needs to happen?