Skip to Content
Author's profile photo Martin Grasshoff

Mobile App Development – Hybrid vs. Native

In my role as Product Manager for the SAP Cloud Platform Mobile Services, customers and prospects seek my advice whether they should build their app as a Hybrid app based on Apache Cordova or using native app development, e.g. with Swift on iOS. While we do support both options with our SAP Cloud Platform SDK for iOS and the SAP Mobile Platform SDK, customers don’t want to invest three months’ worth of development into the wrong technology.
But what are the criteria which should be used to determine which is the best approach? The following discusses the pros and cons and gives guidance.

tl:dr
In the end it is a matter of available skillset – maybe Hybrid does not provide the best possible user experience, but it may be good enough. Native has many advantages, and is very efficient, but no choice if you do have only JS and HTML5 know-how.

The usual suspects

The following matrix describes the typical and well known characteristics which are discussed while deciding between the two choices and I will not explain every bit of it in all detail, but you can read the full explanation in Michael Jess’ blog post here: https://blogs.sap.com/2017/06/21/sap-cloud-platform-mobile-services-development-options/

As you can see, there are many dimensions to discuss this topic and depending on your situation, you need to weigh each point differently.

Another perspective

Hybrid is considered the best choice if you need your app to be supported by different device platforms at the same time. In my discussions with different customers and especially partners I would like to bring up one point that is not too visible in hybrid projects: Situations in which going the Hybrid way backfires and does more harm than good. Let me explain this with an example:
You develop a mobile app that runs on iOS and Android using Apache Cordova. Your iPhone users demand Touch ID support. Browsing the Cordova plugin repository you find a couple of plugins which let you add Touch ID to your application easily. At the time I wrote this article, I got nine results for the search term “touch id” using the Apache Cordova plugin search.

The first hit seems to be reasonably active and maintained with 3k recent downloads and an update just 69 days ago. I don’t want to discuss the risk of using outdated, no longer maintained plugins in your enterprise product – this is all up to you. My point here is that once you start using this plugin, you add to your app something like the following pseudo code:


window.plugins.touchid.isAvailable(
function(type) {alert('TouchID type: ' + type)}, // success
function(msg) {alert('TouchID unavailable: ' + msg)} // fail
);

So far so good. Your app does support touch ID if available on that particular device and the success callback does represent everything you do in your application.
Now, after a couple of weeks of users happily using your application the Android user base demands to have fingerprint support as well. No problem you think, with the right cordova plugin you can easily bring that in.
First, our current plugin does not support fingerprint on Android, so we either need to add another dependency or find a plugin that supports Touch ID on iOS and fingerprint on Android. So let’s do a quick search for “fingerprint”:

Actually, I think the fourth hit is the best fitting in our situation, it seems quite frequently being used, seams active and supports both platforms. So “just” replace this one with the one we used before.
Here’s the API of the new plugin:


Fingerprint.isAvailable(isAvailableSuccess, isAvailableError);
function isAvailableSuccess(result) {
alert("Fingerprint available");
}
function isAvailableError(message) {
alert(message);
}
Fingerprint.show({
clientId: "Fingerprint-Demo",
clientSecret: "password" //Only necessary for Android
}, successCallback, errorCallback);

function successCallback(){
alert("Authorization successful");
}
function errorCallback(err){
alert("Authorization failed: " + err);
}

 

That looks quite promising. It looks like a clean, easy to use API that can be used to access this feature on iOS and Android the same way.
But the devil is in the details. It starts with simple optional parameters, some are for Android and some are for iOS. But there is a thing on iOS, starting with iOS 9.x, where you can check whether a new fingerprint has been added to the database and you should implement this check as well. This plugin does not support this check and we do have couple of options now:

    1. fall back to individual, device specific plugins, which usually supports each platform best, then provide device specific code
    2. just ignore the requirement
    3. fork the plugin and contribute

Regardless of your choice, you will need to add significant device platform specific code in order to support multiple platform at the same time – either in your app, or in the plugin. This, in turn, requires skills similar to Native developers, which, to some extent, defeats the purpose of going Hybrid.

Here’s another example. You want to read/write a simple file in a common location on Android and iOS with the same line of code. So in which of the following locations you want to store it? https://cordova.apache.org/docs/en/latest/reference/cordova-plugin-file/index.html#where-to-store-files
Even here you need to provide device specific code, even if it is not that much. The more you support device specific features, the more expensive your app development becomes – lowering the value of hybrid app development to the point where two native projects become cheaper.
And this observation has been seconded by many partners in recent discussions I had.

Another reason for using a hybrid approach for mobile app development is the idea of reusing the code for a web application and on the mobile device at the same time. This is, of course a reasonable request, as long as two things will be kept in mind:

  • The app on the mobile device is an online application (using caching mechanisms) only
  • The app is not using any device-specific features

Let me explain this in more details. If you are going for an enterprise-grade, offline-capable app there is NO WAY of extending a given online webapp to support offline functionality. I will not go into the details, but here are some talking points why: error handling and conflict management in offline cases, input validation and offline business rules (favorite example: offline price calculator), logon and authentication while offline, multi-user support, and additional user interfaces for some of those. These are some aspects that need to be added to an existing online, webapp to make it fully offline capable. And experience told us that this is typically not an easy task. In general, you could say that extending an online web-app with enterprise offline capabilities is more expensive than creating a second application designed for offline from scratch. And since this is the case, you can consider an online-to-offline migration scenario as a valid case for native app development, too – you can barely reuse the existing code anyway.

More or less the same applies to device-specific features, but here it is not that expensive. Let’s expand the Touch ID example from above. You can extend your web-app to support Touch ID if the JS code is running in a Cordova environment. This can, for instance, easily be achieved using the SAP Fiori Client to run your application. The SAP Fiori Client acts like a browser, by providing the runtime environment of Apache Cordova for your web application. Let’s assume that you develop your app in Web IDE, using the Hybrid App Toolkit plugin, which mocks some common Cordova APIs so that you can preview common functionality in your browser. Sprinkled throughout your code, guard clauses like this are going to grow like weeds, increasing the code complexity:


if(window.cordova // to check if we are in a Cordova environment...
&& window.plugins.touchid) { // ...and our plugin is available, which may not be the case in Web IDE!
// use plugins as before
}

Things tend to become even more chaotic when you are doing this as part of a web app extension – i.e. the original web app was meant to be run in the browser, and you extend the component in order to more closely integrate with a device. If you design your app to run in both environments from the very beginning instead, it can be a viable solution.

If you consider the best mobile user experience and the discussions from earlier in this blog, choosing the optimal approach for your mobile app favors a dedicated approach for your device platform. If you need to build your mobile channel individually, using a native approach results in best user experience.
Nevertheless, if you are lacking either the budget or the skillset – it is a viable solution to go Hybrid.

Please take your time and make sure that you fully understand the implications of going Hybrid or Native in your scenario. A good decision can vastly improve your project outcome and turnaround time.

Have fun,
Martin

Assigned Tags

      21 Comments
      You must be Logged on to comment or reply to a post.
      Author's profile photo Mike Doyle
      Mike Doyle

      Thanks for sharing your thoughts Former Member.  You raise some interesting points.  I would agree that trying to add offline capability to an existing online-only web app will certainly be a challenge.  In contrast trying to write an app from scratch to do both should be viable (using Fiori Mobile/Cordova for the mobile app), given some careful planning.  That would certainly bring significant benefits in some cases.  Of course, if you don't need offline then a web app running (sometimes) in Fiori Client is a good option.

      It seems clear that Android and iOS are winning market share from the other platforms.  For most enterprise customers, supporting these two will be sufficient and that does make a difference in the native/hybrid debate.  If we use the SAP Mobile service as middleware for an Android native app and an iOS native app then the development time is certainly not doubled because the back-end work can be reused (i.e. OData service and CPms config).

      Like many other people (I'm sure) I'm keen to know when we might see a new Android SDK from SAP and I'm keen to really get to know the Mobile Dev. Kit (mdk) and see that come to maturity.  If it delivers on 'write-once with native UX' then it could be very popular.

       

       

       

      Author's profile photo Martin Grasshoff
      Martin Grasshoff
      Blog Post Author

      Hi Mike Doyle,

      thanks for the comment. I completely agree that you can create a offline app and use it for the web-channel is possible. But if you are on this, I'd challenge you if you really want to deliver the same use cases, and UX on both channels. It makes sense for a use case, like leave request. But what about sales force automation? If I'm in front of a customer and want to close a deal on the iPad quickly and with superior UX (the customer is also looking at the iPad screen) - would you just reuse the ordering screen the back-office user sees?

      If you answer this with no - then do a separate mobile app (regardless of technology). If the you say yes, then a quick, cheap reuse is the right approach.

      -Martin

       

      Author's profile photo Holger Schäfer
      Holger Schäfer

      Hi Martin,

      last year i wrote a nice blog and Fiori kapsel Test Client as an example of what can be done with UI5.

      Since i played with Google Firebase which support browser support for Progessive Web Apps (PWA) and also offline DB support with Google Firestore, it would be good to know, if SAP will support something similar in the Future.

      Even Apple startet to implemented PWA into IOS and in the near future offline will be possible with browser based applications without the need for Cordova Container or maybe Native Apps.

      Are there any plans that the Mobile Plattform OData offline Sync services will be supported by SAPUI5 browsers out-of-the-box?

      Regards Holger

      Author's profile photo Martin Grasshoff
      Martin Grasshoff
      Blog Post Author

      Hi Holger,

      we do offer cross platform development options with the Mobile Development Kit and it combines the best of hybrid technology with a true native experience. You can find more information about it here: https://developers.sap.com/topics/mobile-development-kit.html

      Author's profile photo Jay Malla
      Jay Malla

      Hi Martin,

      Nice article!  In your article you discuss the iOS and Android use cases.  We have a scenario where we have already built a SAP UI5 app that the users are running in IE.  Now we would like to add offline capabilities so the users can still fill in the data in their app while not having connectivity.  We want to see how we can approach this from the Windows platform.  I also sent you an email regarding this.  Thanks for your help.

      Regards,

      Jay

       

      Author's profile photo Martin Grasshoff
      Martin Grasshoff
      Blog Post Author

      Hi Jay,

      long story short - we do offer a Cordova Plugin for Offline support that may suit best in your use case. Please also consider our other development options, like SAP Mobile Cards, SAP Cloud Platform SDK for iOS, SAP Cloud Platform SDK for Android, Mobile Development Kit.

      Regards,

      Martin

      Author's profile photo Jay Malla
      Jay Malla

      Hi Martin,

      Thanks for your reply.  At this point, we already have the SAP UI5 app built - but just want to add the offline feature for Windows  Are there any good reference documents for building a Windows Cordova app with the SAP Kapsel plugins?  For the other approaches, I am not sure if there is support for Windows.  The MDK seems to support only iOS right now.

      Thanks,

      Jay

      Author's profile photo Martin Grasshoff
      Martin Grasshoff
      Blog Post Author

      Hi Jay,

      you can find the Kapsel examples in the documentation as well as in this lengthy blog post: https://blogs.sap.com/2013/11/28/getting-started-with-kapsel-part-1/

      The MDK does support iOS and Android, cross-platform with one codeline - not Windows though.

      Kind regards,

      Martin

      Author's profile photo Jay Malla
      Jay Malla

      Thanks Martin - we are looking at doing a Cordova/Kapsel app for Windows with the offline part.  I will review the Blog article you sent - we actually had the iOS app built.  I was wondering if there were any steps to get this working with the Windows version and tie in the build on Visual Studio.  But it looks like it should just be a Cordova ready app.

      Curious - it seems the MDK development is very different and simplified from the regular SAP UI5 development with MVC at first glance.  I went through the tutorials on the MDK on SAP HANA Academy which were quite good and got an offline app to work.  When doing the Actions and connected the pages to the actions - it seems like the details of the view and the controller are abstracted and simplified.  Is that the case?  Is there a good article that documents this?  I will also look into the MDK site.

      I appreciate your help!

      Thanks,

      Jay

       

      Author's profile photo Rahul SEOexperts
      Rahul SEOexperts

      Hey Martin, thanks for this detailed blog on mobile apps and how you’ve defined the differences between Hybrid and Native technologies.

      Regards
      Saurav Sharma

      Author's profile photo Midhun VP
      Midhun VP

      In my opinion this is an old blog. Those who wanted to build apps for iOS and Android with a single code base we have MDK framework. Please have a look:https://blogs.sap.com/2018/08/24/build-a-mobile-development-kit-online-app/

       

      Regards,

      Midhun VP

      Author's profile photo JaiR S
      JaiR S

      HI Midhun VP,

      can you pls suggest me how to start develop offline application for sapui5 ...I create the application is working but the Odata service Im using is SampleServices/ESPM.svc ...so my que is how to add the odata service into SMP server?? if you have any suggestion pls let me knw thanks.

       

      regard

      Jai sharma

      Author's profile photo Midhun VP
      Midhun VP

      Hi Jai,

      This blog talks about it: https://blogs.sap.com/2018/05/22/creating-an-offline-crud-hybrid-mobile-app-in-sap-web-ide-full-stack-with-hybrid-application-toolkit/

      Although hybrid apps are a valid way to develop offline mobile apps, I strongly recommend using MDK framework which supports Android and iOS.

      Regards,

      Midhun VP

      Author's profile photo JaiR S
      JaiR S

      Hi Midhun,

      thanks for response

      I created offline application by using below blog:-

      https://blogs.sap.com/2018/05/22/creating-an-offline-crud-hybrid-mobile-app-in-sap-web-ide-full-stack-with-hybrid-application-toolkit/

       

      but my que is :-

      1. can we use offline Odata for this?
      2. can we use SMP server ?
      3. can we use offline application on desktop?

      thanks

       

      best regard

      jai sharma

      Author's profile photo Midhun VP
      Midhun VP

      Hi Jai,

      1. Didn't get that question though. If your backend is exposing OData service definitely you can develop offline mobile apps. It is also possible to develop offline apps without the need of an OData backend.

      2. SMP is an old technology and it is end of maintenance by Dec 2020. So, it is not recommended to use SMP for mobile apps. The recommended solution is SAP Cloud Platform Mobile Service.

      3. It is a very rare use case a need of offline for desktop. Could you please elaborate the use case.

      Regards,

      Midhun VP

      Author's profile photo JaiR S
      JaiR S

      Hi Midhun VP

      thank you for reply I am using
      this link for build the offline application and its crated successfully but the ODATA is used is not a offline so my question is can we create offline Odata service for offline application??
      I develop online application now I want to convert into offline is that possible?
      if you have proper link or any blog post step by step pls send me
      thanks ..
      best regard
        Jai sharma
      Author's profile photo Midhun VP
      Midhun VP

      Hi Jai,

      You can convert your online mobile app offline using offline Kapsel SDK - please read about it more.

      But, the recommended approach to build apps to multiple platforms is MDK.

      Also have a look at some limitations of OData - https://help.sap.com/doc/c2d571df73104f72b9f1b73e06c5609a/Latest/en-US/docs/user-guide/odata/Offline_OData_Version_Support_and_Limitations.html

      Regards,

      VP

      Author's profile photo JaiR S
      JaiR S

      Hi Midhun,

      I am Trying and let you know.

      Thank you so much for guidance.

      Regards

      Jai

      Author's profile photo Suresh Anantharaj
      Suresh Anantharaj

      Hi Martin, I have read the options compared by the Michael Jess and this article of your. Michael's article has not compared the SAP Cloud Mobile Platform/Kaspel/Cordova, Mobilink/SQLAnywhere and Agentry/Syclo. With so many options around, I am confused which one to choose for apps with Off-line capability and Hybrid applications. I just want to align with SAP's go-to-technology. Thanks

      Author's profile photo Martin Grasshoff
      Martin Grasshoff
      Blog Post Author

      Hi,

      Mobilink/SQLAnywhere Agentry/Syclo are technologies not meant to be used for custom app development.

      We focus on native app development, Mobile Development Kit and Mobile Cards as options - these are the go-to technologies.

      While Hybrid my be an option in certain conditions as described in the blogs.

      Regards,

      Martin

      Author's profile photo Vivek Agarwal
      Vivek Agarwal

      Each business model has its own requirement, and every platform has its own perks and limitation. Time, budget, and stage at which the project is, also play a vital role in deciding these factors. I see @Martin Grasshoff has explained this in a great fashion and it can help tech leaders decide before planing their project.