Cross platform mobile approaches

1,061 views

Published on

Comparison between cross-platforms methods for mobile development:
WebApp, PhoneGap, Titanium, Xamarin, Applause!

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
1,061
On SlideShare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
58
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Cross platform mobile approaches

  1. 1. Cross-platforms for Mobile Development Vũ Phượng Hoàng 08/2013
  2. 2. Content • What is cross-platforms development? • Why do we need cross-platforms? • How to go with cross-platforms? • Comparisons • Conclusions • Q & A • Resources
  3. 3. What is cross-platforms development? • Develop for multiple platforms • Simultaneous (or not) • Mobile platforms: • Android • iOS • Windows Phone
  4. 4. Why do we need cross-platforms? • More customers, more $$$ • Short time to market • Synchronization • Simpler workflow • Can be less headache for developers?
  5. 5. How to go with cross-platforms?
  6. 6. Plan Business Logic Code Compile Test Deploy When do cross-platforms participate?
  7. 7. Plan Business Logic Code Compile Test Deploy When do cross-platforms participate? Web App Hybrid App Interpreted App
  8. 8. Plan Business Logic Code Compile Test Deploy When do cross-platforms participate? Web App Hybrid App Interpreted App Cross-Compiled App
  9. 9. Plan Business Logic Code Compile Test Deploy When do cross-platforms participate? Web App Hybrid App Interpreted App Cross-Compiled App Generated App
  10. 10. Java Code-Base Objective C Code-Base C# Code-Base (Java) Binary (Objective C) Binary (C#) Binary Back-End compile compile compile Native App Eclipse XCode Visual Studio Android iOS Windows Phone
  11. 11. Native App Workflow You must develop each by each platform…
  12. 12. Eclipse Code in Android SDK BuildSetup UI Test Native App Workflow
  13. 13. Eclipse Code in Android SDK BuildSetup UI Test XCode (Must be in MAC OS) Code in iOS SDK BuildSetup UI Test Native App Workflow
  14. 14. Eclipse Code in Android SDK BuildSetup UI Test XCode (Must be in MAC OS) Code in iOS SDK BuildSetup UI Test Visual Studio (Must be in Windows) Code in WP SDK BuildSetup UI Test Native App Workflow
  15. 15. Now, let’s have a look at cross-platforms methods!
  16. 16. Plan Business Logic Code Compile Test Deploy Cross-platforms at “Code” stage Web App Hybrid App Interpreted App
  17. 17. Browser Common Front-End Common UI Back-End use render Resources @ Server Server-side WebApp (Normal Website) Android iOS Windows Phone
  18. 18. Eclipse Code in Javascript BuildSetup UI Test Test Test Test & Tweak Server-side WebApp Workflow
  19. 19. Client-side WebApp (Local HTML files) Browser Common Front-End Common UI Back-End use render Resources @ Local Android iOS Windows Phone • How to make it look like Native?
  20. 20. Browser Front-End (e.g: ) Back-End use render Resources @ Local Client-side WebApp (Local HTML files) Android iOS Windows Phone Android UI iOS UI Windows Phone UI
  21. 21. Eclipse Code in BuildSetup UI Test Test Test Test & Tweak Client-side WebApp Workflow
  22. 22. Problems with WebApp • Home screen shortcut? • Native access? Native Web View (Browser) Back-End Javascript Code-Base compile
  23. 23. Wrapper (e.g PhoneGap) Web View (Browser) Back-End Java Library Objective C Library C# Library Javascript Code-Base use use use compile Javascript Bridge use Hybrid App (Website in a wrapper) Android iOS Windows Phone
  24. 24. Hybrid App Workflow Eclipse Code inSetup UI Test Test Test Test & Tweak Test Ripple Build Build Build
  25. 25. Eclipse Code inSetup UI Test Test Test Test & Tweak Test Ripple Download Hybrid App Workflow (More convenient build version) PhoneGap Build
  26. 26. Javascript (or Lua) Code-Base Java Bridge Objective C Bridge C# Bridge Back-End Abstract Layer (e.g: ) use use useuse Interpreted App (Abstract API Layer) Android iOS Windows Phone
  27. 27. Titanium Studio (Eclipse-based) Code inSetup UI Test Test Test Build Build Build Interpreted App Workflow
  28. 28. Cross-platforms at “Compile” stage Plan Business Logic Code Compile Test Deploy Cross-Compiled App
  29. 29. Cross-compiled App (Multiple Compilers) This is what they advertise …
  30. 30. C# code (Java) Binary (Objective C) Binary (C#) Binary Back-End Android Compiler iOS Compiler WP Compiler compile compile compile Cross-compiled App (Multiple Compilers) Android iOS Windows Phone
  31. 31. Cross-compiled App (Multiple Compilers) And this is what I had to do…
  32. 32. Shared C# code (Java) Binary (Objective C) Binary (C#) Binary Back-End Android Compiler (e.g Xamarin.Android) iOS Compiler (e.g Xamarin.iOS) WP Compiler compile compile compile C# Code for Android C# Code for iOS C# Code for WP use use use Cross-compiled App (Multiple Compilers) Android iOS Windows Phone
  33. 33. Xamarin Studio (Visual Studio-based) Code Shared C#Setup UI Test Test Test BuildCode in C# Xamarin.Android Re-use Shared C#Setup UI BuildCode in C# Xamarin.iOS Re-use Shared C#Setup UI BuildCode in C# Normal C# Cross-compiled App Workflow
  34. 34. Plan Business Logic Code Compile Test Deploy Generated App Cross-platforms at “Logic” stage
  35. 35. Java Code-Base Objective C Code-Base C# Code-Base (Java) Binary (Objective C) Binary (C#) Binary Back-End Business Logic Generated App (Code Generator) Android iOS Windows Phone Android iOS Windows Phone • Why not utilize “Business Logic”? compile compile compile
  36. 36. Java Code-Base Objective C Code-Base C# Code-Base (Java) Binary (Objective C) Binary (C#) Binary Back-End Code Generator (e.g: Applause) Model (DSL) Generated App (Code Generator) Android iOS Windows Phone Android iOS Windows Phone compile compile compile
  37. 37. Generated App Workflow XText (Eclipse-based) ‘Code’ inSetup UI Test Test Test Build Build Build
  38. 38. Method SDK Native Access Perfor- mance Off -line Sync Human Resource Tools Time Ease Native App #1 #1 #1 #6 3 teams Free? 3 unit #2 Web App Sencha iUI #6 #5 #6? #1 1 team Free 1 unit #1 Hybrid App PhoneGap Flash Trigger.IO #3 #5 #5 #2 1,5 team Free 1,5 unit #3 Interpreted App Titanium RhoMobile #3 #4 #1 #5 1,5 team Free? 1,5 unit #4 Cross Compiling App Xamarin Marmalade Strawberry #3 #3 #1 #2 1,5 team $$$ 1,5 unit #5 Generated App Applause #2 #2 #1 #2 1 team + 3 teams Free 1 unit + 3 unit #6 Comparisons
  39. 39. Comparisons – Who uses which? • Native App: • Web App: • Hybrid App: • Interpreted App: • Cross-Compiled Game: • Generated App:
  40. 40. Comparisons – Demo Statistics (Lower is better) 0 5000 10000 15000 20000 25000 30000 35000 Native App Server-side Web App Client-side Web App PhoneGap Titanium
  41. 41. Native App Web App PhoneGap Titanium Native Access Full API None Depend on framework Depend on framework Performance Best Worst – Depend on browser Worst – Depend on browser Good Cost Depend on # of platforms 1 team + quick development 1 team + quick development 1 team but Coded UI? Doc & Support Full documentations Large communities Full documentation Largest communities Good documentation Open forum Have documentation Open forum GUI Design Acceptable Great & Many Great & Many 25$ for ForgedUI 20$ for VisualUI Test Has debugging tools Has profiling tools Great debugging tools Great profiling tools Great debugging tools Great profiling tools Has debugging tools Has profiling tools Short list
  42. 42. Conclusion (Now what?) • Cross-platforms for developing mobile applications are not mature yet • Wise choices: • Web App for simple products (prototype?) • Native App for complex products • Hybrid App for existed Web App • Interpreted App is the market shortcut
  43. 43. • Q: How about native libraries? A: Plugin Bridge for Cordova-based frameworks (OTT application demo) Titanium Modules for Titanium • Q: Can I trust them? A: Behind PhoneGap is Adobe Titanium is trusted by ebay, Mitsubishi Xamarin is managed by GNOME co-founders • ... Q & A
  44. 44. • Quick comparison: http://www.markus- falk.com/mobile-frameworks-comparison-chart/ • Google, SlideShare are your friends • And I am, too :D More resources
  45. 45. Thank you for listening! vuphuonghoang88@gmail.com

×