Packaging HTML5 app for desktop and mobile?

Question

I am looking for a mature solution to package a HTML5 project (html5+javascript+css) as a desktop and mobile app.

The application is currently functional on the web but for convenience I want to offer it as an mobile app (at least for Android and iOS) and as a desktop app for Windows and Mac.

I'm not using any mobile-specific feature (compass, contacts, camera), however the application should have its own webview (Chromium-based?) to ensure it functions the same everywhere.

Some things the app should be able to do:

• Load and save files (via browse dialog if supported by the OS)
• Access localStorage
• Support Web Workers
• Support Facebook

So far I wasn't able to find something to fit all my requirements. I've seen desktop-only solutions (nw.js, electron) and mobile-only (phonegap) and I'm not sure about their support for the features I need. WebKit browsers don't allow web workers for file:/// protocol; IE doesn't allow localStorage with file protocol.

Ideally I'd use one solution to package the app for all platforms with minimal changes to the source code.

Answer 1

It might be difficult to meet all your requirements:

• iOS renders with Apple's UIWebView, even for Chrome: https://developer.chrome.com/multidevice/ios/overview. So you'll still need to refer to http://caniuse.com/ from time to time.
• Access to the local device on a phone gets weird. Using an <input type=file> on an iOS device will bring up your photos, not a browser to look for files on the local device.

That said, I've had pretty good success with PhoneGap. It creates a W3C widget, and can be scaled to a web app if you follow some guidelines: Phonegap code as a web app.