Transcript
Page 1: "HTML5 and Native: Pros, Cons, and Small Examples" by Mark Frawley, Mobile Developer, Jimdo

Pros, cons and small examples

HTML5 and Native

Page 2: "HTML5 and Native: Pros, Cons, and Small Examples" by Mark Frawley, Mobile Developer, Jimdo

MePresent: iOS dev @Jimdo

Featured by Apple in 40+ countries on initial release incl. Germany + USA

Mostly 5 star reviews!170k+ downloads

Page 3: "HTML5 and Native: Pros, Cons, and Small Examples" by Mark Frawley, Mobile Developer, Jimdo

In the Past

Lead Mobile Developer @HostelworldCross-platform strategy: One small HTML5 codebase, Titanium, PhoneGap, web, some native extensions

When we started these apps, mobile was 0.5% of revenue, today it is about 15% (3/4 years later)

Page 4: "HTML5 and Native: Pros, Cons, and Small Examples" by Mark Frawley, Mobile Developer, Jimdo

The Native Nerds

“HTML5 is just so broken, audio doesn’t work, animations are laggy, same origin restrictions, storage restrictions..”

The HTML5 Nerds

”Programming for a closed OS/app ecosystem is so 90’s.” “I want to be in control of my release process.”"We are a web company, we should leverage those skills”

Page 5: "HTML5 and Native: Pros, Cons, and Small Examples" by Mark Frawley, Mobile Developer, Jimdo

The Users

They don’t care or even realize whether something is an app or a web app, they DO care about getting the job done, and how painful/painless that experience is. - Me

Page 6: "HTML5 and Native: Pros, Cons, and Small Examples" by Mark Frawley, Mobile Developer, Jimdo

Are Users Stupid?

“Opponents of the usability movement claim that it focuses on stupid users and that most users can easily overcome complexity. In reality, even smart users prefer pursuing their own goals to navigating idiosyncratic designs.” - Jakob Nielsen

Page 7: "HTML5 and Native: Pros, Cons, and Small Examples" by Mark Frawley, Mobile Developer, Jimdo
Page 8: "HTML5 and Native: Pros, Cons, and Small Examples" by Mark Frawley, Mobile Developer, Jimdo

● Not having to say no to our designer all the time ;)

● Animations are always nice and smooth, no crazy CSS voodoo found via StackOverflow.

● Apple’s documentation is amazingly detailed and correct.

Native: Pros

Page 9: "HTML5 and Native: Pros, Cons, and Small Examples" by Mark Frawley, Mobile Developer, Jimdo

● Bleeding edge features readily available (blurred backgrounds in iOS7)

● Threading, networking, audio, 3D graphics, camera, address book, linking to other apps... no restrictions

Native: Pros...

Page 10: "HTML5 and Native: Pros, Cons, and Small Examples" by Mark Frawley, Mobile Developer, Jimdo

Native: Cons

● Long development time for features● GUI creation tools (Storyboard, Interface

Builder) not up to scratch...● Native apps crash more (source: Crittercism

market analysis)● Opaque, sloooow approval process (for iOS)

Page 11: "HTML5 and Native: Pros, Cons, and Small Examples" by Mark Frawley, Mobile Developer, Jimdo

Native: Cons...

● Being featured won’t necessarily make you rich.

● You just won’t believe how much code is needed to do certain things, like display a list.

● Affiliate referrals are tricky to attribute for iOS (adjust.io)

Page 12: "HTML5 and Native: Pros, Cons, and Small Examples" by Mark Frawley, Mobile Developer, Jimdo

HTML5 Pros

● Prototyping is fast● You can leverage your existing dev teams to

some extent, keep a generalist, not specialist culture.

● If you have a HTML5 mobile app, you have a mobile website for free!

● Porting between platforms can take days instead of months/years.

Page 13: "HTML5 and Native: Pros, Cons, and Small Examples" by Mark Frawley, Mobile Developer, Jimdo

● Most apps are technically simple, don’t require 3D, multiple audio streams.

● Mobile is > 90% webkit, so testing in Chrome with those fancy web developer tools works well.

● Remote debugging is also now possible, inspect the DOM, add breakpoints.

HTML5 : Pros...

Page 14: "HTML5 and Native: Pros, Cons, and Small Examples" by Mark Frawley, Mobile Developer, Jimdo

HTML5 : The cons (Cracks knuckles)

● Getting stuff to feel native/smooth is hard, requires mobile web specialist knowledge (touchstart, touchmove, touchend), webkit CSS transitions, backface culling switches.

● If there’s a browser bug/change (iOS7 broke a lot), you’re boned.

● Little documentation around performance

Page 15: "HTML5 and Native: Pros, Cons, and Small Examples" by Mark Frawley, Mobile Developer, Jimdo

HTML5 : The Bad

● You find yourself reinventing the wheel (emulating native view controller transitions, navigation controller stack history, app localisation)

● The nail in the coffin will come from user reviews: “What’s the point in having an app if it does exactly the same as the website?”

Page 16: "HTML5 and Native: Pros, Cons, and Small Examples" by Mark Frawley, Mobile Developer, Jimdo

There’s no right answer

Use HTML5 if:● your app is simple, your interface is going to

be mostly custom.Use a native app if: ● you can afford it ● you want to add value with native-enabled

features (image filters, offline storage etc)

Page 17: "HTML5 and Native: Pros, Cons, and Small Examples" by Mark Frawley, Mobile Developer, Jimdo

But don’t take my word for it

Let’s try building a simple app using both HTML5 and natively for iOS using XCode.

git remote add origin https://[email protected]/firlefans/berlin_demo_html5.git