mobile app development: going hybrid
DESCRIPTION
If you think about going native, there's a few things you may want to know. This presentation shows you how we at Centralway got into it and how we took it on a high, production-grade level. It's also sharing two "war stories" about things that didn't go so well along with things you should generally be aware of or avoid in the world of hybrid applications.TRANSCRIPT
Going hybridMobile apps with web technologies
What’s hybrid?
How do you do that?
PhoneGap
SenchaTitanium
Calatrava
Trigger.ioRhoMobileM Project
MoSync
AppFramework
How do you do that?
PhoneGap
SenchaTitanium
Calatrava
Trigger.ioRhoMobileM Project
MoSync
AppFramework
Woah! Wait - what?http://avgp.github.io/hybrid-strategy-picker/
The 3 big secrets1. The uncanny valley
The 3 big secrets2. Hybrid is different from everything
The 3 big secrets3.
The hitchhiker’s guideto PhoneGap
TestTest often & test in Phonegap!
OptimizeCaching, Minification, LocalStorage
Use the forceConnection API, Battery API, Accelerometer
If it’s native......there’s a PhoneGap plugin for it.
War stories
iOS and the iframes
<iframe src="http://example.com"></iframe><a href="http://somesite.com" target="_blank">Open</a>
Android: iframe is embedded, link opens a browseriOS - round 1: iframe opens a new browser on start.iOS - round 2: "stay-in-webview=true"
iframe is embedded, link opens in the app
Android and the datepicker
The browser on Android
Android and the datepicker
PhoneGap on iOS
Android and the datepicker
PhoneGap on Android
Android and the datepicker
What the ..??
The dark side of the browser
● “Relayout” & Repaint events● HW-acceleration is magic● Bitmap grouping (webkit-transform: translateZ(0))● Compositing● Be really careful with AppCache
Links
● http://engine.centralway.com● http://docs.cordova.io● http://aerotwist.com/blog/making-a-60fps-
mobile-app● https://wiki.mozilla.org/WebAPI● http://www.w3.org/2002/mmi/● http://www.w3.org/Mobile/mobile-web-app-
state/
Thank you! Questions?