HTML5 vs Native Mobile App Development: Webinar Slides & Video!

html5 vs native mobile app development propelics itexico webinar

It’s now clear that mobile is the path consumer markets are leaning towards to utilizing mobile apps as their preferred way to conduct e-commerce. According to a study by Gartner, 70% of customer interactions will originate from a mobile device by 2015. More and more organizations are realizing that mobile can significantly impact their core business operations and are transitioning to a mobile-based strategy.  Therefore, we partnered with Propelics to deliver our most recent webinar: "HTML5 vs Native Apps: Demystifying The Decision Making Process"

Even when CIO’s can prefer HTML5-based web apps due to lower development costs and other optimization driven factors, the native mobile application is alive and well with a prominent place with mobile consumer behavior. The approximate time that a user spends on a mobile app versus a web app is in an 80-20 proportion, where the app has a clear advantage in the preference of users.

When choosing between HTML5 or native development for you mobile strategy, an uninformed decision can result in considerable extra expense, dissatisfied users and poor performance and experience.  The following is the webinar recording.  If you would like to read a summary, our post highlights the key points made in the webinar.

HTML5 vs Native: Demystifying the Decision Making Process - Webinar Recording from Propelics on Vimeo.

So, taking the into account the above, we will analyze six key considerations in the decision making process for your mobile strategy and mobile app development.

1. Let the mobile use case drive the decision

There are advantages and disadvantages in each of the HTML5, native, or hybrid approaches.  We’ll quickly go through the most important factors that will impact app developers and mobile app development.

HTML5

Pros

Cons

Cross-platform deployment cost

Performance

Update Speed

Pixel Perfect UX

Availability of skill sets

API’s to platform specific features

Support multiple platforms

Extensive offline support

Quicker learning curve

App monetization

No App Store approvals needed

Inconsistent browser support*


*For a better reference on specific HTML5 functions vs. different mobile browser versions, we recommend you visit mobilehtml5.org*

 

HTML5 Applications (Apps) Observations:

 

Overall, HTML5 can result into intermittent experiences due to the large amount of devices and operating systems available in the market today. Also, most visitors will come from search engines and social networks, with all their inherent advantages and constraints. Another significant consideration, when it comes to web apps and applications, is that Internet connectivity is essential as very little functionality can remain without being connected to the web.

Hybrid Apps:

 

A hybrid application commonly uses a webview wrapped around native controllers such as title bars, navigation elements, and tabbed sections. According to Gartner, by 2016 over 50% of all mobile apps deployed by the enterprise will be of hybrid nature.


Pros

Cons

Mix web code with native wrapper

Performance - Browser dependent

Less code to support multi-platform

Requires more specialized development skills

App Store experience

Native apps that don’t look native

API’s to access device features

Risk of App Store rejection

Make changes without re-submit to App Store

Extensive offline support

Inconsistent browser support

 

Hybrid Apps. Observations:

 

By choosing the hybrid route, there is a way to accommodate multiple platforms without compromising on the “App Store” experience. Web traffic enters directly into the embedded web content from the mobile device without depending on search engines or social media. There is also an ability to use more native controls to complement the content shown inside the wrapper. This allows organizations to implement a better offline support experience to their mobile app users.

Native Apps

 

Pros

Cons

Rich user interface

More difficult to support / maintain

Bes app performance

Increased time to update / distribute

Most secure

Skills can be hard to find

Hooks into all device’s API’s

Risk of App Store rejection

Extensive offline support

Limited app portability

Monetization

Expensive

 

Native Apps. Observations:

Going native has become a de-facto way to deliver a highly customized user experience to the market. It is heavily used across the industry and provides a highly immersive experience making use of devices features like the camera, calendar, notifications, orientation changes, advanced animations and many others. This approach makes the best use of security and distribution control while managing data internally as needed.

2. Availability of Development Skills: 

This is important and one of the biggest drivers of the initial up-front costs.  Some key questions you’ll be asking yourself at this stage are:

How many platforms do you need to support?  There is iOS, Android, Blackberry, Windows, Tizen?  How many form factors are you going to support?  Phone, Tablet, Phablet?

 

If you are planning to build a Native App, each platform will need its own developer/developer team: iOS an Objective C application developer, an Android developer, and Windows Mobile is a .Net developer.

Also, the chances of finding someone who is good at all three development platforms is extremely rare (and are on high demand by all specialized software companies).

Developers familiar with web technologies are more abundant, easier, and cheaper to hire than experienced Native developers. However, if you are looking for experienced front-end mobile web developers, again, you are looking for a person with very in-demand skills.

The experienced mobile application developer who is good in one or more scripting languages has a good grasp of CSS3, and most importantly JavaScript.  They will use JavaScript frameworks like Backbone.js, JQuery Mobile, Dojo, or Twitter’s Bootstrap framework.  All these are relatively new technologies, and finding experienced people is always a challenge.

If you are going the Hybrid route, again, you are looking for someone with these previously mentioned skills and knowledge of JavaScript and the platform you are going to use.  This will be difficult.  At iTexico, we have resorted to pretty much training our incoming employees, and have trainers in-house that hold classes every month to develop the skill sets we need.

If you decide to support more than 2 platforms and more than 1 form factor, the costs of building Native Apps can be high versus the costs of building a Web App.

 

Recommendations:

If budget/cost is issue & you have to support multiple Operating systems then a HTML5 or Hybrid approach is the best.

 

3. Maintenance & Support

 

Developing a Mobile App is just the first step. We can guarantee that you’ll be releasing more versions. You will want to release the next version whether it is: to fix bugs, introduce new features in response to user feedback, or improve the user experience.

Here two factors complicate the situation for Native/Hybrid Mobile Apps over Web Apps.

 

First and foremost, you need the user to download the latest version from the App Store.  This is usually out of your control.

Second, in the iOS App store there could be a lag of up to a week for updates.  In Web Apps, you don’t face these challenges; your users are always using the latest version.

 

Testing is a big factor in maintenance & support.  Testing resources start adding to budget costs when you want to support multiple platforms.  You will need a lot of devices to test for each platform.

 

Even if you are building Web Apps, you should not underestimate the costs associated with optimizing for the various browser versions/device/manufacturer combinations that exist among the different mobile, tablet, and other devices.

 

Carriers still lockdown Android handsets. Therefore, there are a lot combinations of older versions of browsers, OS(s), & devices you will need to support.  The same problem but on a smaller scale exists with iOS devices.

 

Assuming there is a business objective behind your mobile App, you will have analytics, performance, and monitoring built-in. Therefore, someone is designated with the task of monitoring, interpreting, and making actionable recommendations based on that.

Bottom Line: Planning and budgeting for supporting your app through its application lifecycle will protect your investment. Don’t underestimate your budgeting for maintenance and support.

 

4. Performance

Thanks to Steve Jobs everyone expects really great performance from their mobile phone.

 

A central part of the user experience is performance of the application on the mobile device. It usually comes in two forms: rendering and loading.

 

Loading basically means fetching information from the server, while rendering means displaying that information on the device.

 

Native Apps have the advantage that all the assets such as images and backgrounds are packaged with the mobile application. They do not have to be downloaded and are shown much faster to the mobile device user.

 

Native applications have set the standard for what a user expects from a performance perspective.  The performance gap between HTML5 and native is so great that even ordinary users easily notice the difference.  They specifically notice on standard gestures expected on a phone: scrolling, swiping and rotating the phone.

For Hybrid Apps, from a performance perspective, I want to make a distinction between two approaches.  One is the Apache Cordova style Hybrid App and the other is Appcelerator’s Titanium based App.  Apache Cordova, for those of you who are unfamiliar, is essentially PhoneGap.

The PhoneGap approach is essentially packaging a Web App inside a Native container, and rendering the Web App inside a Webview - essentially a web site inside an App.

Appcelerator’s Titanium uses a different approach.  It does not use WebViews.  Instead, the JavaScript API is mapped to the Native code.  The compiled code is native binary.  There is still an interpreter running, but the mobile application is a native App.

From a performance perspective, PhoneGap’s performance is the same as a Web App’s performance, while Titanium based mobile applications come very close to a native level of performance.

Recommendations

If Performance is not critical, go for a Web Application or a PhoneGap style mobile app approach, otherwise stick with a Native or Titanium App.

 

5. Security

 

Along with Performance, Security is one place where Native mobile apps shine over Web Applications, here are some concerns that the native approach has address over HTML5.

 

Source Code Visible:  More and more of the Application logic in HTML5 Apps is now stored in Client side JavaScript. It is relatively easy for someone with malicious intent to see the source code.  Unfortunately, we have come across sites, where even API keys were visible. So, it is really important to use good coding practices when writing web apps.

URL based Vulnerabilities:  But even beyond just sloppy practices, Web Apps are susceptible to all the usual suspects like cross-site scripting, cookie manipulation, & SQL injection.

Data on Device:  HTML5 now offers the ability to cache data within the browser.

 

Since both native and HTML5 applications manage data on the device, this data should be appropriately secured and encrypted while at rest.

iOS and Android allow you to encrypt stored data, but there is no equivalent capability in the HTML5 world.

Secondly, MDM and MAM vendors provide another level of security for native apps. But, they can’t affect data on the browser’s cache so they cannot secure it.

 

Data in Transit: SSL is the most common way that both native and HTML5 apps to secure their data in transit.

 

For additional security, many organizations also implement VPNs.  While VPNs can support both native and HTML5 traffic, they come with significant performance overhead.  When it comes to data in transit, HTML5 forces a tradeoff between performance and greater security.

 

Recommendations

If Security is critical, Native Apps are your best bet.

 

6. Avoid Re-Litigating the decision for every app idea

 

It’s very important to build a framework for making the decision between HTML5, Hybrid or Native development. Some things you should consider when doing so are: user population and supported devices (some statistics might be of great help for achieving this), the types of devices you’ll users will have, the use cases for your application (like location, connectivity, frequency of use, brand/visibility and functionality), performance, security, and your maintenance and support strategy.

You can download the slides of our webinar below:


About the Authors

Richard Dutra is a Silicon Valley executive and entrepreneur who loves building startups and being part of the ground floor at companies. He believes mobile will be the single most important device we own and its capabilities are endless. He currently works as VP of Business Development at iTexico. You can contact him at rdutra@itexico.com

 

Adam Bookman has been the brains behind many mobile product and program launches. He has advised companies on mobile strategies for business units as well as IT departments. He continues to be a “Trusted Advisor” to some of the leading brands around the world. Adam is frequent speaker at conferences related to mobile. Follow Propelics on Twitter

 

Oscar Salas

Written by Oscar Salas

Oscar Salas is a B2B Digital Marketing Specialist with 5 years of experience, who has helped organizations to grow and expand through strategic brand development and marketing programs. Analytical thinker, cat lover, he enjoys to play the piano and listening to Led Zeppelin He's currently leading the iTexico Demand Gen strategies.

Explore iTexico, The Nearshore + Company 

Explore The Nearshore Services

Test

Recent Posts