Your SlideShare is downloading. ×
HTML5 vs Native Android: Smart Enterprises for the Future
Upcoming SlideShare
Loading in...5

Thanks for flagging this SlideShare!

Oops! An error has occurred.

Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

HTML5 vs Native Android: Smart Enterprises for the Future


Published on

Published in: Technology

  • Be the first to comment

No Downloads
Total Views
On Slideshare
From Embeds
Number of Embeds
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

No notes for slide


  • 1. HTML5 vs Native Android Smart Enterprises for the Future Suzanne Alexandra Android Technology Evangelist
  • 2. @suzalex@motodev#html5vsnative
  • 3. where well play tonight
  • 4. 2011: Mobile exceeds PCs business insider
  • 5. 2012: Mobile ubiquity "We now live and always will live in a multi-device world, where companies and consumers choose different smartphone and tablet platforms and expect to get apps on all of them." -- Forrester Research
  • 6. Native Android Mobile middleware four tracks HTML5, JavaScript Hybrid
  • 7. Hybrid Experience CostNative Web Performance Agility Middleware
  • 8. Enterprise class apps Real mobile experiences that challenge the processing power, memory and display of the best mobile devices and platforms, for large brands and large audiences, with vibrant content, at transactional scale.
  • 9. Native Android
  • 10. What is native? android sdk android ndk (c/c++) renderscript
  • 11. Native apps run here
  • 12. Key technology benefitsNative user experience Integrate with android platformBest hardware integration More discoverable on deviceIntegrate with other apps Run smoother, better, faster
  • 13. image from gallerycamera microphone capturing photo app widget, notifications
  • 14. Key business benefitsLow barrier to entry Reuse app functionalityDistribute through markets Rich ecosystem, wealth of materialOpen and free platform
  • 15. Cloud to device messagingPush a message, from your app serverTo Googles messaging serverTo the deviceDevice then contacts another server to download data
  • 16. Google Play  Easy to upload  Easy to update  Malware checks  Device or feature filtering  MonetizationGoogle Play is a trademark of Google Inc.
  • 17. Market filtering <?xml version="1.0" encoding="utf-8"?> <manifest ... > <uses-sdk android:minSdkVersion="8" android:targetSdkVersion="11" /> <uses-feature android:name="android.hardware.bluetooth" /> <uses-feature android:name="" android:required="true"/> </manifest>Google Play is a trademark of Google Inc.
  • 18. But the cost?Development and design* $250,000But, allow 1.5x – 2x $375,000Then repeat, multiple platforms $750,000 ++ * one estimate,
  • 19. The platforms Native Android Cross-platform No User interface High Performance High Cost High Updates Google Play Store Languages Java, C, C++
  • 20. Mobile HTML5
  • 21. Financial Times One app, many Android devicesvideo
  • 22. Cross platform Android smartphoneiOS Android tablet
  • 23. Graceful degradation<canvas>Your browser is not supported</canvas> Feature detection !!document.createElement(canvas). getContext cross platform Multiple CSS files styles.css mobile.css android.css <h1 { color:white; text-align:center; }
  • 24. Canvas<canvas id="canvas" width="838" height="220"></canvas>
  • 25. Geolocationnavigator.geolocation.getCurrentPosition ( function ( position ) { … } );
  • 26. Offline access … app cache CACHE MANIFEST index.html stylesheet.css images/logo.png scripts/main.js <html manifest="demo.manifest">
  • 27. Web socketsvar connection = new WebSocket(ws://;
  • 28. Web workers var worker = new Worker(worker.js);
  • 29. Challenge: layoutsdesktop 1600 px tablet 800 / 1280 px smartphone 320 / 480 px
  • 30. Responsive design Tiles on a flexible grid Media queries to check device @media Think differently about content Beginners Guide to Responsive Mobile Design
  • 31. Challenge: interaction touch and gesture, tap and swipe
  • 32. Touch and gesture Touch is instant, but click has ~300ms delay You also need swipe Basically, you need a touch libraryfastclick, assanka.net
  • 33. Now.What about security?
  • 34. A few tips Make sure the device is password protected and encrypted. Store locally only a small subset of enterprise data. Consider changing the schema of a local database. Do origin checks on cross-document messaging. Remember Chrome for Android. article
  • 35. How HTML5 and Chrome help Origin X-Frame-Options WebSocketsSandboxingMultiprocess architecture
  • 36. And one more thing App updates are pushed out instantly on your server -- no waiting
  • 37. Browser comparison Android Browser Google Chrome Feature Android 1.5+ Android 4.0+ Canvas Geolocation 2.0+ Video + Audio 2.3+ App cache 2.1+ Web storage 2.0+ Web sockets Web workers
  • 38. The platforms Native Android HTML5 Cross-platform No Yes User interface High Medium to high Performance High Medium Cost High Low Updates Google Play Store Your server Languages Java, C, C++ HTML, CSS, JavaScript
  • 39. Wheres it all going?The business model also changes as the revenue streamsgenerated from app stores diminish, causing vendors to turnto value added services to generate income. - Smiths Point Analytics
  • 40. Lets talk @suzalex
  • 41. thanks ·
  • 42. LEGALLICENSE NOTICESExcept where noted, sample source code written by Motorola Mobility Inc. and provided to you is licensed as described below.Copyright © 2012, Motorola, Inc. All rights reserved except as otherwise explicitly indicated.• Redistribution and use in source and binary forms, with or without modification, are permitted provided that the following conditions are met:• Redistributions of source code must retain the above copyright notice, this list of conditions and the following disclaimer.• Redistributions in binary form must reproduce the above copyright notice, this list of conditions and the following disclaimer in the documentation and/or other materials provided with the distribution.• Neither the name of the Motorola, Inc. nor the names of its contributors may be used to endorse or promote products derived from this software without specific prior written permission.• THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.Other source code displayed in this presentation may be offered under other licenses.Apache 2.0 Copyright © 2010, Android Open Source Project. All rights reserved unless otherwise explicitly indicated. Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.Creative Commons 3.0 Attribution License Portions of this presentation are reproduced from work created and shared by Google ( and used according to terms described in the Creative Commons 3.0 Attribution License ( MOTOROLA and the Stylized M Logo are trademarks or registered trademarks of Motorola Trademark Holdings, LLC. All other trademarks are the property of their respective owners. © 2012 Motorola Mobility, Inc. All rights reserved.