A common question asked by mobile app developers is this, ‘Should I build my app with HTML 5, or build native?’. There are a wide range of reasons why you would choose either of these, and the proponents of both have very valid and compelling arguments. With this article, we will explore the various types of app categories, and discuss the pros and cons of both methods.

Definitions

Before we begin, we ought to define the terms, HTML5 app and Native app, to prevent ambiguities, and needless arguments in the comments.

If you intend to develop a graphic intensive game, you almost certainly want to build a native app.

A native app, for the purpose of this article, refers to an application built completely using technologies native to a particular operating system. This could be Android, iOS, Windows, Blackberry, etc. For Android, native apps are typically built using Java, while for iOS, a native app can be built using Objective C or (more recently) Swift.

A HTML5 app, on the other hand, refers to a mobile app built completely using HTML, CSS and Javascript only. HTML5 apps are web apps and they must be run using the underlying OS browser. Note that HTML5 supports offline data as well as rich media, such as audio and video. A well written HTML5 app can be used even when the device is offline, or at the very least, show an error message.

Comparison of HTML5 and Native Apps

Portability

HTML5 apps are portable across different OSes and device types. A HTML5 app written with responsive design methods would also scale appropriately depending on the size of the device it’s currently viewed on. When an update is required, the single app is updated and tested, and is available for all devices immediately.

Native apps, by definition, are unique to each OS, and so, to support multiple mobile OSes, a separate app must be written for each OS. When an update is required, each app must be updated independently, and tested independently. Android apps do not modify the layout to match the size of the device automatically, however, during development, different layouts can be specified for different device/screen sizes and orientations. This usually results in layouts that are more aesthetically pleasing compared to automatic responsive design HTML5 apps, albeit with more effort and planning required.

Winner: HTML5

Cost to develop

HTML5 apps are generally cheaper to develop and maintain than native apps, since just the single app is required for multiple OS support. This single app can be developed by a single web developer. However, native apps for all major mobile OSes would typically require a specialized developer for each OS (Java for Android, Objective C/Swift for iOS, C# for Windows), which would be significantly more expensive than a single web developer.

Winner: HTML5

Speed and Efficiency

Native apps are almost always more efficient, and faster than HTML5 apps. Despite the strides made in increasing the speed of Javascript interpreters, a HTML5 app cannot execute at the same speed as a native app of similar functionality. Apple’s App Store can reject apps for being too slow or not feeling native enough, which is more likely to occur with a HTML5 app than a fully native app.

Winner: Native

Use of Hardware

Native apps can interact with a wide range of the hardware available on a device, including location, camera, accelerometer, speakers, screen and more. HTML5 apps do not have the same ability to interact with the hardware, which can be a major deal breaker, depending on the desired functionality of the app.

Winner: Native

If you need to deliver an app for the lowest cost at the quickest speed on multiple mobile OS types, a HTML5 app is almost always the preferred way to go. However, if your app needs to make use of device specific hardware, or needs to run very fast, you will do better with a native solution.

Hybrid Apps

html5_vs_native_hybrid
However, as with most things related to computer, there is more than one solution. There is a third category of apps, called hybrid apps. Hybrid apps are built using on language/framework, and are then wrapped with native specific code for each desired mobile OS. For example, you build an app using HTML5, CSS and Javascript, then generate a wrapper around the app for Android, iOS, and Windows devices. The final product is, to all intents and purposes, a native app for each platform, however, they share a single code base. To the end user, a hybrid app is no different from a native app. Popular hybrid app frameworks include Apache Cordova (formerly PhoneGap), Appcelerator Titanium, Appear IQ, CocconJS and Appzillon among others.

Hybrid apps are not all roses though. There are both pros and cons:
Pros

  • Hybrid apps are as portable as HTML5 apps. They allow code reuse across platform, with the framework handling all platform specific differences.
  • A hybrid app can be built at virtually the same speed at which a HTML5 app can be built. The underlying technology is the same.
  • A hybrid app can be built at almost the same cost as a HTML5 app. However, most frameworks require a license, which adds an extra development cost
  • Hybrid apps can be made available and distributed via the relevant app store, just like native apps
  • Hybrid apps have greater access to the native hardware resources than plain HTML5 apps, usually through the corresponding framework’s own APIs.

Cons

  • Not all native hardware resources are available to hybrid apps. The available functionality depends on the framework used.
  • Hybrid apps appear to the end user as native apps, but run significantly slower than native apps. The same restriction on HTML5 apps being rejected for being too slow on Apple’s App Store also apply to hybrid apps. Rendering complex CSS layouts will take longer than rendering a corresponding native layout
  • Each framework has it’s own unique idiosyncrasies and ways of doing things that are not necessarily useful outside of the given framework.

While the HTML5 vs native app debate still rages on, it is worth mentioning that there are literally dozens of valid reasons to develop a HTML5, native or hybrid app. However, the most critical question shouldn’t be “What technology should we use to develop?”, but rather “What does the app do?”. The functions the app is intended to perform, when spelled out adequately would often answer what technology is appropriate.

If you intend to develop a graphic intensive game, you almost certainly want to build a native app, in order to give users the fastest and most responsive game play possible.

If you are writing an app for a business that enables executives on the go access company information, you can decide between a hybrid or HTML5 app, especially if your app has no need to use device hardware, and should be available to use on the user’s preferred device.

If you are developing an app that is the core of your business, like Instagram, you might want to build a native app, to provide the best experience for your users, or go hybrid, so that it will be be available to as many users, on as many devices, as possible.

Did we leave anything out? Hit the comments and let us know.

  • Sameer

    This debate is running for long time, and hybrid app already label failure because they sucks in user experience.

    • rieln

      Then you obviously have not seen our HTML5 app to display performance stats and graphs which can be navigated and swiped trough with insane speed and transitions. Building native for this (and this type of apps have huge demand!) is trowing money in the river really (besides, we now support EVERYTHING, from Chromebook to a Lumia 520.

      • le_lutin

        What is your HTML5 app?

        I have developed native, hybrid and web apps and I have yet to see a hybrid app (on android) which is as slick as it would have been were it written natively. To be fair, I think this is probably more related to the performance of web view as opposed to how the app is written.

      • Sameer

        Show me link of your apps

      • Kent

        I would also like to see your app :)

        • rieln

          Unfortunatedly, that is internal purpose, I am not allowed.

          But creating dynamic charts, using webcomponents (polymer in this case) to build the UI, it just feels super smooth on any device.

  • Влатко Стојанов

    Native Android app. Period. One more period to be more sure. Mobile web “apps” are slow AF with terrible UX!
    There’s a good saying that goes like this: Keep the web into the browser dude!

    • rieln

      But get your programs on the web, dude! :)

      • Влатко Стојанов

        Get your web programs on the web, but get your native Android app on Android, dude!

  • abazigal

    So HTML apps can mean less work for the developer, but native apps work better for the end user. Seems like a real conflict of interests here.

    • Vanessa

      It depends… You can create native apps without any coding knowledge and with a great user experience by using app building platforms like the one of GoodBarber http://www.goodbarber.com/

      • Marian

        Easy there :), I see native android programming more easilly to handle than hybrid one.

  • yottaz

    Potential of navigators is increasing, so potential of HTML5 apps too.

  • Benjamin Modayil

    Great article!

  • hashmi58

    (*****-_-_-_-_-_-_-******) androidauthority====== —->SEE INFO< <<<< >
    (*****-_-_-_-_-_-_-******)

  • Mariohdblog

    If I have a responsive website, does exist a Service that can build in simple way a web app with notifications?

  • Bin Sand

    Really informative blog.

    I am an iOS app developer and I have developed more than 50 apps till today with the help of Native app development platforms as well as Cross Platform app development tools.

    Frankly speaking, I like native app development platforms more compared to Cross platforms.

    I have developed apps with Phonegap, Telerik, App Builder, Configure.IT and many more. As per my experience, configure.IT is the best because of the following features of this tool,

    Drag & Drop Facility
    App Development without coding
    One Click API Connect
    You can directly use .PSD file for UI purpose, there is no need to design UI manually.

    For more details about this too, visit:
    http://www.configure.it/

  • Really informative blog.

    I am an iOS app developer and I have developed more than 50 apps till today with the help of Native app development platforms as well as Cross Platform app development tools.

    Frankly speaking, I like native app development platforms more compared to Cross platforms.

    I have developed apps with Phonegap, Telerik, App Builder, Configure.IT and many more. As per my experience, configure.IT is the best because of the following features of this tool,

    Drag & Drop Facility
    App Development without coding
    One Click API Connect
    You can directly use .PSD file for UI purpose, there is no need to design UI manually.

    For more details about this too, visit:
    http://www.configure.it/

  • Great article! I started building apps today with HTML 5. I really like how easy it is. My next step is to learn the native apps building process.

  • coldasicezero

    Great article! You just answered all my questions at once.

    Thanks!