HTML5 for mobile development.

Transcription

1 HTML5 for mobile development

2 HTML5 for development (I) HTML5 to be the silver bullet of development Low entrance - barrier Runs over VM (write once, run everywhere) ECMA-262 Almost every device with a browser runs it

3 HTML5 for development (II) (Now IE6 is dead) Let s move this holy grail to the mobile world!!! Just take care of: PC is not mobile battery, devicepixelratio, screen size, connectivity... Vendors, vendors everywhere

4

5 Only for mobile web sites? Each mobile device has a browser Current JS libraries create a good UX in browser We re able to create Single Page Applications in browser

6 Only for mobile web sites? (II) Almost every mobile browser runs a compiled version of WebKit!

7

8 Developer s hell (I) ios, Android, Windows Phone, BlackBerry, Firefox OS Specially in android ecosystem: Each android vendor uses its own flavour of webkit WP and android: Developer tools absent (or external scripting needed) Hacks, hacks everywhere

9 Developer s hell (II) Fall 2013 / 2014 better for developers: Android 4.4 comes with chrome as system webview ios 7 is being updated to be more compatible Older devices?

10 Access to mobile native features More implemented in new mobile browsers, but: Custom, vendor-specific Non-standard javascript API Most advanced JS APIs to native features: Firefox OS BlackBerry webworks

11 UI/UX on mobile HTML5 Hard to maintain same feel cross-browser Mobile slower than land connections How can be defeat native UX?

12 Possible solution HTML5 packaged apps zero-time download Cross browser UX Increased speed

13 Alternative 1: Phonegap

14 Alternative 1: Phonegap (I) Adobe powered free service Upload your cordova project installable app Deals with app signing features

15 Alternative 1: Phonegap (II) The good: Cordova-based cloud compiler Oldest one. De-facto solution Access to native features through plugins Easily extensible

16 Alternative 1: Phonegap(III) The bad: System webview Slooooooooooooooowwwwwwwwww. Doesn t solve the cross browser hacking hell

17 Alternative 2: Intel XDK + crosswalk

18 Alternative 2: XDK + crosswalk Intel developed solution Cross compilation for different mobile OS Integrates lots of SDKs

19 Alternative 2: XDK + crosswalk (I) The good: Uses HTML5 + JS Exports to lots of platforms Intel powered

20 Alternative 2: XDK + crosswalk (III) The bad: Needs all the frameworks to compile Not very used in industry Slooooowwww Android WV backport quite recent Intel powered

21 Alternative 3: CocoonJS

22 Alternative 3: CocoonJS Started by Ludei: San Francisco based company Technical office in Bilbao Current de facto solution for HTML5 game development

23 Alternative 3: CocoonJS (II) 1. Started as HW accelerated canvas for ios and Android a. CocoonJS launcher to test your developments b. 2D /3D support (webgl opengl bridge) 2. Custom JS extensions to deal with native APIs: a. Notifications, IAP, Multiplayer, Ads, FB/twitter 3. Free cloud compilation service 4. Multi OS App development framework and cloud compiler (ios, Android, WP, Tizen, FFOS)

24 Alternative 3: cocoonjs (III) The good: Cloud based cloud compiling exporting to multiple OS Canvas games run at 60 FPS (even OLD devices) Android WV backported to android 4.0 (Webview+) Compatible with cordova plugins Remote debug Custom, non-standard JS interfaces: In app purchases, notifications, ad network integration, FB, Multiplayer support (Google Play Games, Gamecenter)

25 Alternative 3: cocoonjs (IV) The bad: Custom, non-standard JS interfaces: Don t work on Firefox OS, Windows Phone and BlackBerry webworks Small code changes needed in canvas based games to get full dom support

26 Conclusion HTML5 close to be native-ready but...not ready-to-deliver-solution on mobile render engine too slow some features still missing different UX through devices Developers still have to tweak their code

27 Questions?

28 @txusinho