To go native or mobile web?

When you hear of a ‘mobile app’, you are probably envisioning something that you download to your phone via a marketplace like iTunes and then run by tapping on the cute little rectangular icon. Apps like these are called ‘native’ apps, because they live on your phone and run directly atop your smartphone’s operating system [...]

When you hear of a ‘mobile app’, you are probably envisioning something that you download to your phone via a marketplace like iTunes and then run by tapping on the cute little rectangular icon. Apps like these are called ‘native’ apps, because they live on your phone and run directly atop your smartphone’s operating system (like a Indian boy running across the prarie?). But like Paul Harvey would say, stay tuned, you are going to hear the rest of the story.

HTML Web Apps

HTML5: It’s like Robitussin for apps

However, there is another type of mobile app, one that you do not download, but rather visit in your smartphone’s browser: mobile web apps, or more commonly referred to as “HTML5″ apps. A mobile web app is just a web site that has been styled to fit the smaller screen of a smartphone. With the advent of HTML5, mobile web apps can be built to replicate most of what previously could only be done through a native app, like persistent storage. Mobile web apps offer a great advantage over native ones: platform independence. A mobile web app can be viewed using any device with a modern web browser (mmm Internet Explorer doesn’t count). Also, if you have an existing web site and want to create a mobile experience from it, then a mobile app might be the way to go as the effort to modify an existing web app for a mobile browser is much less than it is to write a native app from scratch.

But, mobile web apps come with some pretty severe limitations as they run within a web browser and not directly atop the smartphone’s operating system like a native app. So if you want your app to receive push notifications, use location services, or access the phone’s camera, a mobile web app will not work. In general, mobile web apps are great for experiences that are consumptive in nature, like a cookbook or restaurant review app, but do not work for apps that require access to the smartphone hardware like an Instagram or Spotify.

Hybrid Apps: Can we all just get along?

Hybrid Apps: Rodney King’s choice

There is a middle ground emerging between mobile web apps and mobile native apps, appropriately called hybrid apps. A hybrid app tries to be the best of both worlds by using a native written container to host web pages that contain the content for the app.  The benefit here is that since it is a native app, you can access the camera, and GPS. With a hybrid,  the native container would be a thin wrapper around a set of HTML documents that contain the app’s functionality.  The Facebook app is a great example of a hybrid app. The Facebook app is a native written container that renders HTML pages downloaded from the web. But its not all peaches and cream when it comes to hybrids. If you’ve used the Facebook app, you’ll also know that its terribly slow and buggy. The Facebook app appears non responsive at times and is slow to update because it is using the smartphone’s web browser to download and render each page. If it was natively written, the Facebook app would run directly against the hardware and benefit from a considerable real and perceived performance boost.  If you want to explore hybrid apps,  the Adobe PhoneGap framework is a good place to start. Using PhoneGap, you can build a hybdrid app that can access the GPS and camera while rendering all content via HTML.

Even as a mobile developer, I can’t deny the allure of HTML-based apps. Why should we all go and re-invent new ways to retrieve, render and modify distributed when the HTML (and CSS 3.0) provide a standard way for doing all of that? Plus the platform independence HTML provides opens your app up to many more users than what can be economically achieved with a native app. The HTML model isn’t perfect, mainly due to limitations browser place on what can be accessed from within a HTML document, but its a pretty good place to start.

Advantages

Disadvantages

Good For

Native Apps

·   Speed, run much
faster than web apps.

·  Do not require an internet
connection to use.

·  Can access smartphone hardware such as GPS,
music player and camera

·  Costly to develop, typical app takes 3-6
months to build.

·  Requires specialized developer skill set.

·  Runs only on single platform.

·  Photo-sharing or location-based apps (i.e. Instagram, Highlight)

·  Graphics intensive gaming.

·  Media playing apps (i.e. Spotify)

Web-based Apps

·  Can be used on any device with a modern web
browser.

·   Does not require user to download app from
marketplace.

·   Can easily adapt existing web site to be
mobile ready.

·   Easier to find a web developer than a platform
developer.

·  Requires an internet
connection to be used.

·  Cannot access GPS, or camera.

·  Cannot receive push notifications.

·   Has to be run within a web browser.

·  Newspaper, information-sharing apps (i.e.
Financial Times)

·  Cookbooks, Restaurant reviews.

·   Building mobile experiences around existing
web sites.

About Bobby Gill

I am the creator of Bahndr, founder of New York based app development lab, Blue Label Labs and editor at Idea to Appster. I like crepes and I am fascinated by big data.

  • Olakunle David

    Hi, i appreciate this info, been a great help. I intend to build a mobile app – Hybrid. But what i don’t know or understand is how to build that “thin native container” for access to device hardware especially storage. I read something about cached files, could you shed more light on that if you understand what i am saying?

  • http://www.oscial.com Bobby Gill

    Hey David,

    I just posted an answer to your question in our new Q&A area here http://www.ideatoappster.com/questions/how-to-build-the-thin-native-container-for-hybrid-apps/#answer-3791

    Let me know if that helps or you need more information.