Distributing your HTML5 app via the App Store or Marketplace

So how do you ensure your carefully crafted HTML5  reaches the targeted device sets – and users?

Todays post relates to delivering an app you have carefully crafted using HTML5. Once again there are multiple approaches and frameworks for delivering your applications to your targeted device set.

Via web

The simplest option is to just distribute your HTML5 application as is via the web. It is then up to the end user to add a hyperlink to their mobile desktop. This approach is great because it avoids the approval process of something like the Apple App Store, as HTML applications are not vetted by Apple first.

Custom application wrapper for HTML5

The next option is to consider rolling your own application wrapper for your HTML5 application. With this approach you can take your HTML5 app and deliver it inside a native application. In particular both iOS and Android allow this approach through the use of the UIWebView and WebView components. These views allow you to add your own hooks and even execute arbitrary Javascript to interact between your native application wrapper and your website displayed inside your webview. In order to handle this approach you will need to read up on the appropriate WebView you intend to use for each of the mobile platforms.

Third party product wrappers for greater device reach

If you want to provide a native application experience to an even broader range of devices, then you are probably better off considering something like PhoneGap, which provides a common approach to wrapping your HTML5 application for a much larger range of devices. Under the hood it uses the devices WebView component, but provides a much richer set of hooks and Javascript API’s so that your HTML5 application can take advantage of native phone features, like GPS, Storage, Camera etc.  PhoneGap allows you to target your HTML5 app at 6 different mobile platforms, including iOS, Android, Blackberry, Palm, Windows Phone and Symbian. The PhoneGap approach allows you to use the same PhoneGap JavaScript API in your HTML and it will work across the entire device range (some device capabilities, may vary slightly).

HTML5/Javascript app converted to native app

If you want to go a different route altogether and you are starting from scratch you could consider a framework like Titanium’s Appcelerator. This framework lets you build an HTML5/Javascript based application that then gets converted via the framework into a native application for each of the platforms supported. At the time of writing Appcelerator supports the iOS and Android platforms. Appcelerators focus is on building native Application from underlying HTML and JavaScript code base. This results in a faster end app, as it is running native code, but does mean you need to learn the Titanium Javascript API’s for constructing your application.

Pros and cons

Once again each of these approaches has its pro’s and con’s and it really depends on what you are trying to achieve with your HTML5 app, and what platforms you intend targeting. If you end up wrapping your HTML5 app as a native application, you will still need to go through whatever app store approval processes that are required for each of the platforms. There has been discussion that Apple don’t support the new and improved Nitro Javascript engine for the UIWebView component currently.  This means that products like PhoneGap on iOS will also miss out on the improvements made to Javascript engine by Apple (at least in the current iOS version). But if you are running your HTML5 app directly in Safari, then you will see the speed advantages of the new Nitro Javascript engine.