HTML5 or Android for Mobile Development?

70,021 views

Published on

Android apps or the mobile web? It's often a hard choice when deciding where to invest your mobile development resources. While the mobile web continues to grow, apps and app stores are incredibly popular. We will present both perspectives and offer some suggestions for making the most of each platform.

Published in: Technology
8 Comments
47 Likes
Statistics
Notes
No Downloads
Views
Total views
70,021
On SlideShare
0
From Embeds
0
Number of Embeds
770
Actions
Shares
0
Downloads
1,248
Comments
8
Likes
47
Embeds 0
No embeds

No notes for slide

HTML5 or Android for Mobile Development?

  1. 1. Revised v4Presenter Web or Native for Mobile Development? Android Reto Meier @retomeier Web Michael Mahemoff @mahemoff
  2. 2. The Question • Should you build you mobile apps as HTML5 apps or native apps?
  3. 3. The Answer YES
  4. 4. The Case for Native Apps
  5. 5. If you can't think of a way to improve your web app using Android SDK features...
  6. 6. If you can't think of a way to improve your web app using Android SDK features... You're doing it wrong!
  7. 7. Standards Will Always Trail Innovation • Hardware support • Rich Integration
  8. 8. Impending Hardware Standards • Location Based Services • Microphone input • Accelerometers
  9. 9. Hardware is Rapidly Evolving • 2007: Multi-touch, accelerometers, microphone • 2008: Video, compass, background apps • 2009: Bluetooth, multiple screen sizes • 2010: Gyroscopes, front facing cameras, NFC • 2011: ???
  10. 10. New Hardware Platforms • Tablets • Televisions • Cars? Picture Frames? Fridges? Washing Machines?
  11. 11. Currently Supported Hardware • Smartphones / Tablets / Television • Microphone • Video camera (front facing / rear facing) • Sensors (compass, gyro, accelerometers, light • Multi-touch • Telephony and SIP stacks • Bluetooth
  12. 12. Intents Based Data Sharing • Lets 3rd parties exchange data • Lets apps extend each other
  13. 13. Ubiquity • Widget, Live Folders, Live Wallpapers • Quick Search Box • Notifications • Ability to replace native apps
  14. 14. True Background Services • Alarms • Intent Receivers • Cloud to Device Messaging • Background execution / concurrent apps
  15. 15. Current Android Platform Features • Geo services • Sensors • Interprocess communications (Intents!) • Background, scheduled, and concurrent apps • Home screen widgets and quick search box • Rich multimedia • Native (C/C++) development • Full database / SQLLite support • Camera and microphone access • Deep system integration / replacement
  16. 16. Native App Strengths • Apps that use the hardware • Apps that integrate system features • Apps that work with other apps • Apps that need to be fast • Apps that are ubiquitous
  17. 17. The Case for HTML5
  18. 18. Remember when computers were computers?
  19. 19. TVs were TVs?
  20. 20. Mobile phones were thumping great bricks?
  21. 21. Form Factors Rock!
  22. 22. Form Factors Rock ... for users! But less so for developers.
  23. 23. Modern Developer, You need to consider ... Desktop Laptop Netbook Smartphone Feature phone Tablet TV
  24. 24. As a Developer, you need to consider ... Watch? Car? Fridge? USB Desktop Aquarium? (Maybe not.)
  25. 25. Desktop Windows OSX Linux ...
  26. 26. Mobile Android iOS BlackBerry Windows Mobile 6.5 Windows Mobile 7 (rewrite) Symbian Meego ...
  27. 27. How about in 2015? Anyone's guess! But one platform is likely to be there: Web.
  28. 28. Write Once, Run Many is starting to sound like a good idea
  29. 29. Web Handles Many User Interfaces Browsers use a fluid layout model. Sensible defaults, whether a 10cm phone or a 200cm TV Target specific platforms with CSS Media Queries
  30. 30. Web Provides Secure Sandboxing Same-origin policy prevents sharing across different domains
  31. 31. Web Provides Porous Boundaries It's not black-and-white. Apps *can* share data securely - OAuth, Cross-Origin Resource Sharing, Cross-Document Messaging.
  32. 32. Web Supports Permissioning Now we have rich functionality on the web, e.g. GeoLocation. But not every app gets access. As with smartphones, browsers ask permission first.
  33. 33. So Web Architecture is Good in Theory How about in practice?
  34. 34. HTML5 is Ready Today Not 2050, Not 2020. Today.
  35. 35. HTML5 is Ready Today Oh and it's fast too Javascript Performance Benchmark http://is.gd/dAKqS Firefox 0.8 (2004): 1802ms Chrome 7 (2010): 10ms DOM Rendering Benchmark http://jsperf.com/dom-selection-appending/2 Firefox 0.8 (2004): ~111ms (9 ops/sec) Chrome 7 (2010): 2ms (460 ops/sec)
  36. 36. User Interface: Canvas Canvas: Effect Engine HTML5 Game Jam: "Enterprise"
  37. 37. User Interface: CSS Custom Fonts Transforms Much more...
  38. 38. Input Geolocation Orientation Speech Detection Idle Detection Device API: Camera? Microphone? http://flickr.com/photos/mofetos/435827739/
  39. 39. Networking Your Grandpa's HTML: Links Forms Ajax: XMLHttpRequest Now: Cross-Domain access with CORS 2-Way Streaming with WebSocket Server-Sent Events with EventSource
  40. 40. Offline Application Caching Web Storage Web SQL Database Indexed Database File Access
  41. 41. Installable, if you want to Mobile: PhoneGap, Titanium, Roll-Your-Own Desktop: Google Chrome Web Store
  42. 42. And Besides Compatibility ... Open standards Open source Easy to dive in Tools and library support Diverse community
  43. 43. Want to Learn More? HTML5Rocks.com ChromeExperiments.com Want to Learn Even More? http://www.html5rocks.com/resources.html
  44. 44. 'Which?' is the Wrong Question
  45. 45. Web Apps • Near universal coverage • Deploy once, update instanly Native Apps • Deep hardware and platform integration • Support for rapid hardware innovation • Device and platform specific features • Optimized user experience Two Great Tastes that Taste Great Together
  46. 46. • Yes! • Build a web client first to offer your app to the largest possible community of users. • Build an optimized native client that leverages platform specific features and an optimized user experience. Both? Really?
  47. 47. • Hardware access? • Feel the need for speed? • Background or concurrent execution? • System access? • Deep integration? Understand Your App's Needs
  48. 48. HTML5 in Native Most platforms include a native Web View control. Include Web View for specific features Book reader: The catalogue Game: High scores or use HTML5 for the entire app ...
  49. 49. HTML5 for Entire App Wrap HTML5 app as native. Can also use native capabilities. Nitobi PhoneGap http://phonegap.com/apps http://build.phonegap.com (private beta) http://apparat.io/ from Uxebu (private beta) Appcelerator Titanium http://appcelerator.com
  50. 50. Native Apps with HTML5 Make it work offline. Use client-side storage when offline. Don't point to server...package it up! Or use Application Cache and Client-Side Storage.
  51. 51. Native Apps with HTML5 Prioritize platforms. For high-priority platforms, customise UI and incorporate native features. CSS Media Queries. JavaScript Feature Detection (Modernizr library). Introduce native styling. UI Toolkits: Sencha Touch, jQTouch, jQuery Mobile ...
  52. 52. Questions! • Twitter: o @retomeier (Android) o @mahemoff (Web)

×