I’m not going to try and convince you that mobile development is important – I hope you already recognize that it is! If you need further convincing, head on over to Allison Christman’s article – she gives you all the reasons you’ll need. However, while she mainly discussed mobile websites, I’d like to give an overview on mobile applications and their development methodologies. Should you build for the platform or the browser? Or both? What is the difference between a mobile website and a mobile application? What is a hybrid application? Knowing the strengths and weaknesses of each approach is vital when making the decision on how to best reach and serve your end-users.

Native App Development

Native app development is what most people think of when it comes to smartphone apps, and for good reason. The majority of apps available today are native. That is, they are developed using platform-specific languages and tools such as Objective-C and Xcode (for iOS), and Java and Eclipse (for Android). Targeting multiple platforms through native app development can be challenging due to the multi-faceted expertise required, and also because you have to build and maintain multiple codebases at once. But it also allows you to give your end users the experiences they expect from their platform of choice. Additionally, native apps almost always exhibit better performance – especially when it comes to gaming, which can require rendering complex graphics and user interface (UI) elements. Therefore, if native UI integration and performance are high on your list of requirements, then building a native app is what will deliver those results.

Web-Based App Development

Web-based apps are applications or websites that run within the mobile web browser, rather than the platform’s native UI framework. The difference between an “app” and a “website” in this context is purely semantic: basically an app enables users to complete a task (e.g. finding movie times), whereas a website is broader in scope and is used mainly for accessing information (e.g. finding out about a movie theater chain).

While I hope at this point that every website you build is responsive or adaptive to multiple screen sizes, if you are building an app you could do it with HTML5, CSS3 and JavaScript and deploy it purely over the web. Libraries such as jQuery Mobile and Sencha Touch make this incredibly easy.  The big advantage is that you can bypass each platform’s store to deliver your product directly to your customer. Unfortunately the downside to this is also what makes web-based apps unique – that they run inside the web browser. As a result, they can be perceived as being harder to use and less intuitive than a native app. This perception is not always true, however. It is in fact possible to develop web-based apps that are on-par with native apps. Take Facebook, for example. In September 2012, Facebook CEO Mark Zuckerberg said the following at the Disrupt SF conference:

“When I’m introspective about the last few years I think the biggest mistake that we made, as a company, is betting too much on HTML5 as opposed to native… because it just wasn’t there. And it’s not that HTML5 is bad. I’m actually, on long-term, really excited about it. One of the things that’s interesting is we actually have more people on a daily basis using mobile Web Facebook than we have using our iOS or Android apps combined. So mobile Web is a big thing for us.”

While he didn’t dismiss HTML5 entirely, it was pretty clear that he believes that, for now, the Facebook iOS and Android native apps are superior. In response, the folks at Sencha cloned the native Facebook app within their HTML5 mobile app framework. They then posted a video showing them side-by-side, pointing out how in many ways the HTML5 app running inside the mobile browser outperformed the native app, and was equally (if not more) usable. And this was all done nearly a year ago.

Therefore, if done right, it is possible to build great experiences that live within a mobile web browser. Web-based apps are completely platform-agnostic, and the HTML5/CSS3/Javascript codebase is one that is accessible by many developers and offers a very streamlined approach to app development.

Hybrid App Development

[pullquote]Smartphone users spent 87% of their time using mobile apps as opposed to using the mobile web.[/pullquote]So web-based HTML5 apps can keep up with, or even outperform, some native apps in most respects. So what’s the catch? The catch is that, contrary to Mr. Zuckerberg’s above statement, a recent Nielsen study showed that (as of March 2013) smartphone users spent 87% of their time using mobile apps as opposed to using the mobile web. People simply expect the ease and convenience of navigating through an app that utilizes their platform’s native UI rather than the inconsistency found from one website or web-based app to another.

Enter hybrid app development. Like web-based apps, hybrid apps are built using HTML5, CSS3 and Javascript, rather than native languages such as Java or Objective-C. Development occurs within mobile frameworks such as PhoneGap or Titanium (along with many others), which encapsulate the code in such a way that it is deployable just like a native app to various mobile platforms. They are designated “hybrid” because they are not purely native (since they do not run within the platform’s native UI), nor are they web-based (because they do not run inside the mobile browser). Rather, the rendering for most hybrid apps is done using web views within each platform, which is basically a web browser (minus all the browser window decoration) that fills 100% of the device screen’s width and height.

While this sounds like “have your cake and eat it too” situation, one of the biggest drawbacks to hybrid apps is their performance…or rather lack thereof. Web views simply do not have the rendering power afforded by a native UI, and performance can vary from one platform to another. The frameworks that don’t utilize web views (such as Titanium) instead use Javascript interpreters that evaluate the code at runtime and insert it alongside native objects within the environment (sort of like the relationship between inline Javascript and HTML).

This approach has its own set of difficulties: the varying performance of interpreters from one platform to another, increased app load times due to the need to load the interpreter and all its associated libraries, and the inability of the “translated” Javascript to produce results that mimic every single piece of a native UI perfectly. As a result, if you have a complex, resource-intensive app such as a game, natively-built apps will almost always have the edge. On the other hand, information-heavy apps such as those that offer news and other information might be a great fit for hybrid development.

Conclusion

So where does this leave us? Building apps natively will obviously give you great results, but it’s just plain hard to do for multiple platforms. Building web-based apps using HTML5/CSS3/Javascript eases development pain, and mobile browsers are growing performance-wise by leaps and bounds. However end-users still seem to prefer apps that install and act natively on their devices. Hybrid apps seem to solve both problems – easing development pain while giving users the native experience they desire, but basically if you want to deliver anything complex or graphically intensive, the “one-size-fits-all” solutions that hybrid frameworks offer just aren’t quite up to snuff. An ongoing series of articles about PhoneGap development by Chel Ramsey Productions does a really good job summarizing this point:

“It is the opinion of the industry that any application that will rely heavily on graphics or frequently use the devices native features would be better as a native application for performance purposes. Applications that are content heavy, but not really graphically heavy and do not rely heavily on using the phone’s features are a good fit for Phonegap.”

Having said that, the mobile world and all that goes along with it (hardware, software, and even user behavior) is continually changing and evolving. Just because hybrid apps don’t perform as well right now doesn’t mean they never will – the allure of maintaining one codebase of HTML5, CSS3, and Javascript that compiles to multiple platforms is just too enticing for the idea to go stale. And just because users spend most of their time with natively built apps right now, might just be because developers haven’t started doing web-based apps the right way or in large volume. Therefore, it’s important to go with the approach that best fits your needs today, while keeping an eye on the horizon for what may be coming tomorrow.