how to hybrid : effective tactics in html5-native app development

How To HybridEffective Tactics in HTML5-Native App DevelopmentMICHAEL HANTLER

Here’s Looking at you Multiplatform

The Woes of Multiplatform1. Multiple code bases

1. Duplicate code2. Bug fixes for each platform 3. New features require multiplied resources

2. Separate dedicated development teams1. Resources locked to platforms2. Extra synchronization needed to align features

So What is the Answer?

HTML5: The Answer to All our Prayers

HTML5 Adoption

HTML5 Adoption Mobile (~ 2/3)

No Partial Yes0

20

40

60

80

100

120

Android Browser 4.4.3

No Partial Unknown Yes0

20

40

60

80

100

120

iOS Safari 8.0

Data provided by http://caniuse.com/

No 33Partial 16Unknown 1Yes 103

No 31Partial 15Yes 107

Only need a few blocks to make apps

$$

Building the next-big-mega-HTML5-app

And………Forget this I’m out!

JavaScript: Performance on Mobile

From the articles “Mobile web apps are slow” and “Why mobile web apps are slow” by Drew Crawford

What the big boys are saying…A “reason we’ve gone native is trying to get some of the animations — the spinners and the way they work — getting that smoothness, we felt like we needed native to really do that well.” - Kiran Prasad LinkedIn’s senior director for mobile engineering (VentureBeat)

“When I'm introspective about the last few years, I think the biggest mistake that we made as a company is betting too much on HTML5 as opposed to native.” – Mark Zucherberg CEO Facebook (CNET)

To the recycling bin?

We can rebuild it, we have the technology

=+HTML5: reusable

code, dynamic from server.

Native: Powerful, fast, full access to

OS feature set, optimized.

Hybrid: Best of both worlds.

Gartner Reports: Hybrid or Bust

Gartner, “the world's leading information technology research

and advisory company”1, “predicts that more than 50 percent of mobile apps deployed by 2016 will be hybrid.”2

PhoneGap (Cordova) framework

An open source solution for building cross-platform mobile apps with standards-based Web technologies like HTML, JavaScript, CSS.

Under the bridge

JavaScript Java

Examples on GitHub All example code can be found on Github at https://github.com/mhant/DroidConTLV2014

Basic Bridge example

Example: Ads

Example: Drawer

Example: Login

Shout Outs

www.AndroidDev101.com

Delivering the highest quality mobile app and web app development. Previous clients include Caesars Interactive Entertainment, YMCA related firms, and a wide assortment of breakthrough startups.