Should My App be Native or Hybrid? Depends on Who is Asking

It is a pretty common occurrence these days that we see news about the current trends of native apps versus HTML5.  Talk about a lot of hand waving and generalities!  Let’s first clarify the categories:

  • Native comprises predominantly iOS and Android apps, but also includes Blackberry and Windows.
  • HTML5 is actually two categories: mobile web (think m.yourcompany.com) and hybrid mobile web apps.

HTML5 is on the decline!

recent InfoWorld article (referencing a Forrester research paper) concludes that HTML5 is “no silver bullet” because, “… HTML5 apps are known to be slower than native mobile apps and take longer to develop and test.”  The InfoWorld article identifies the main culprit as HTML5 support in mobile web browsers due to bugs and slow updates.  The article also cites a slight decline in developer interest in HTML5 from the quarterly Appcelerator / IDC survey of 6,698 developers. The article does acknowledge that HTML5 may be suitable for a subset of apps like “internal lines of business.”

HTML5 is on the rise!

A different article on ReadWrite by Matt Asay concludes just the opposite: developer interest in HTML5 is increasing.  Based on a survey of 7,000 developers (Vision Mobile’s Developer Economics report for Q1 2014), HTML5 mindshare climbed from 52% to 54% while iOS declined from 56% to 52%.  The article does a great job in breaking down the demographics and economic motivational forces at play; such as how iOS apps still drive a bigger share of revenue for developers.

Who to believe?

What to make of all of this?  First, sample set sizes and survey results can widely vary—duh.  One wonders if the 6,698 Titanium developers are losing interest in HTML5 because of their experience with Appcelerator’s toolset? Why this is happening doesn’t have a direct answer, yet. For every report showing one thing, there seems to be another that can show the opposite.

StrongLoop’s position around this dichotomy centers around the following:

  • HTML5 is not a panacea for the cross-platform challenge in mobile and does not fulfill the “one size fits all” dream through responsive web
  • The right “platform” of choice for your individual development effort is totally irrelevant without examining your use cases
  • What is truly important depends on who you are and your mobile strategy and needs

Let’s decide for ourselves

Take a look at this HTML5 compatibility chart for mobile features.  At first glance your initial impression may be how fragmented the features and capabilities are in each of the listed platform.  Lots of checkmarks all over the place.  But then when one runs down the list of HTML5 features you really wonder which are more “mainstream” or foundational features (such as CSS3 support) versus more specific to a use case like for real time communication streaming (such as WebRTC).  Furthemore, are we talking every mobile browser listed?  If not, the cross section that actually matters becomes even smaller.

When deciding on the platform of choice for whether to go native, mobile web or hybrid, taking your use case and cross referencing it against the wide capabilities of the HTML5 feature set geared to mobile probably leads to a much small intersection that what is listed at large especially on a per app basis.  Does your typical consumer mobile banking app from the likes of Wells Fargo require bi-directional support offered by websockets?  How about web audio?  Does your typical consumer web radio app like Spotify?  Your answer and your intersection of use cases to features are going to heavily depend on your intended use cases.

Finally, let’s make the biggest distinction: are we talking about the consumer-facing applications that are used to make money like Angry Birds where the app is the company?  OR are we talking about the enterprises who need to extend their core functionality into mobile, whose mobile strategy is to maintain the same level of user engagement as what they have waning in the web world.

Conclusion

Having gone through the exercise above and absorbing the context of what really matters, it’s clear that it depends on who’s asking and what their use cases are.  At StrongLoop, we believe for most enterprise use cases developing cross-platform hybrid apps provide the greatest flexibility, re-use, and most importantly ability to leverage existing web developer resources and skills.  We’re pushing the envelope for full-stack JavaScript solutions for mobile development with efforts like BACN (Bootstrap, AngularJS, Cordova/PhoneGap and Node), powered by the open source LoopBack API server.

What’s next?

 

 

BACN Scrabble – Alternatives to Bootstrap, Angular, Cordova and Node

In our previous blog post on BACN, we listed multiple dimensions of consideration for the front end of our “full stack” JavaScript development methodology. Are these the only dimensions? Absolutely not. Would there be other combinations that maybe meet the requirements now and in the future? Absolutely.

In fact, we so strongly believe so that we’re either already planning or continually evaluating multiple permutations of these frameworks – effectively front end “Scrabble” where BACN becomes :

We’ve heard interesting and also very credible “substitutions” from the community as well – like Canadian BACN (the Canadian version being CouchDB), BACWN (with WebKit), and others that are derived from other use cases.

If you are new to the idea of full-stack JavaScript development or the BACN stack, check out my video on these subjects:

Going down the stack, here’s a breakdown of the various components.

UI Framework

Considerations:

  • A lot out there already.
  • A lot emerging too: next-generation web-app/multi-channel/mobile.
  • Enterprises typically have already standardized or adopted something for web.
  • Enterprises may or may not be open to a new UI even for bridging into mobile.

Strategy:

  • Have something as a reference for folks who don’t have anything or are open to something new.
  • Make the UI framework portion of our front end mobile development framework pluggable for flexibility.

Client MVC Framework

Considerations:

This is a relatively new component in the enterprise. The term “front end” used to still mean something that was served up entirely server side. With the rise of single page applications, the client has become thicker and more responsive to perform routing, presentation, logic, and state modification. For purposes of mobile “packaging,” this also enables the client to be more self-contained to support offline use.

Strategy:

Appeal to different development approaches:

  • Unopinonated – favors control and flexibility over convention and assumption for use cases.
  • Opinionated – favors convention and assumption for speed and productivity over control and flexibility for use cases.

Build reference implementations for BackboneJS (un-opinionated) and AngularJS (opinionated)

Native Device Bridge

Considerations:

Only two have been generally “accepted’ or adopted in the enterprise – PhoneGap and Apache Cordova. However, there are other contenders such as Trigger.io.

Strategy:

Start with Cordova and assess compilation and build challenges to maintain “build” independence. Fallback would be PhoneGap or Trigger.io

Node/LoopBack

Considerations:

Node is the ultimate API glue especially for Javascript-based hybrid or mobile web apps because it’s:

  • Javascript for both front end and back end. Using one language means potentially one developer, which means increased efficiency and productivity.
  • Able to handle multiple connections gracefully. Because it’s asynchronous, it doesn’t have to wait for a downstream response: it can serve the next incoming request.
  • Event driven and reactive. It does something only when it needs to, rather than run logic continuously and synchronously pile up resources.
  • Easy to orchestrate, aggregate, and perform simple operations to send back a modified response as an API.

Strategy:

  • Build and support LoopBack as an open-source framework that is extensible because it’s based on Node.
  • Offer the most common mobile services used in many apps such as push notifications, user registration, and file storage.
  • Build and evolve client SDKs that make it even easier to take advantage of the backend without having to delve into it.
  • Play nicely and integrate well with legacy resources to leverage existing data and services

If you’d like to compare these components, check out our component matrix.

Conclusion

What does this all mean?  It means “BACN’ or any combination acronym is a pattern or idea of fusing together a client MVC framework, native device bridge, and a UI framework to better meet the needs of mobile or multi-device channel with a hybrid mobile app.  It’s not necessarily one implementation.  There are many combinations that could meet this criteria and associated use cases and we here at StrongLoop encourage such exploration and discovery.

We believe that client MVCs and the associated single-page apps are only now being exploited for web development and that there is a new generation of frameworks being developed that could blur the lines even more between native and hybrid mobile apps.  The most exciting common thread is that full-stack Javascript is catching on and just waiting to be exploited by companies who have already invested heavily in web development and now need to cross the chasm to mobile and multi-channel development.

What’s Next?

 

BACN – A Recipe for Fast and Open Mobile Application Development

BootstrapAngularJSCordovaNode.js

What is BACN?

At the Google Developer Live Presentation in October, we introduced BACN as an extension of MEAN (MongoDB, Express, AngularJS, and Node) for enterprise mobile app development. The developer community is increasingly adopting MEAN for building rich web applications because of its speed and ease of use.  We are introducing a similar stack for mobile applications called BACN: Bootstrap, AngularJS, Cordova, and Node.

We chose these components for mobile web and hybrid applications because of their rich feature set and because they are in best-of-breed in:

  • Ease of use
  • Developer community adoption
  • Enterprise familiarity
  • Leveraging JavaScript on both front-end and back-end

On the front end, AngularJS provides an MVC (model-view-controller) framework for single-page web applications. Bootstrap as the UI framework adds mobile features such as built-in responsive layouts. Cordova provides native device functionality such as access to contacts list and camera.

On the back end, BACN builds on MEAN by using LoopBack as the Express-based Node framework to connect to enterprise data sources and services beyond MongoDB. LoopBack effectively becomes the API server for “multi-channel” delivery; it gives you a head start in wrangling your back end services as APIs to be consumed by any type of client.

Read more