mobile app development hybrid vs native
TRANSCRIPT
Hybrid vs. Native
Mobile App Development
Outline
Mobile development today Native and Hybrid app development overviews Intro to Cordova and Ionic Reasons for going Hybrid Reasons for going Native Real-world demo Conclusion and product information
Mobile Application Development
Mobile Web Sites• Web languages:
JavaScript, HTML5, CSS
Native Applications • iOS App: Objective C /
Swift • Android: Java• Windows Phone (UWP):
C#
Hybrid Apps • Mix of web and native
approach• Native app-like
experience: Ionic Cordova (Hybrid)
Web Application Development
Desktop Websites Looks nice on high res / dpi screens Highly feature-rich
Mobile Websites m.google.com / google.com Single domain have logic to control layout
Why aren’t web apps enough?
End users need to open up a web browser and navigate to your site Not available in any App Stores Bound to limitations of browser You’ll need to support every web browser for each OS Doesn’t feel like they are using an app
Two Philosophies of Mobile App Development
Hybrid Web Apps JavaScript/HTML5 web
apps with native wrapper Ionic Cordova
Native App Development Java, Objective C, C# iOS, Android
Hybrid App Development
Web apps execute within native wrapperso Wrappers provide device APIs
Cordova creates Hybrid Web Apps Hybrid Web Apps
o Blends mobile site with native app-like experience o Utilize existing responsive web frameworks o Same code base as desktop and mobile web apps
Native App Development
Apps that target iOS, Android, or Windows Phone Design single screens and navigation between them UI can be built in designer, expressed in markup language, or
generated in code behind Each platform has its own codebase Develop in different IDE’s for each platform
Hybrid App Development
What if we could develop one single code base for our website and still provide a mobile app to our end users… without having to duplicate business logic?
Best of Both Worlds
About Cordova
Free and open source by Apache Allows you to use JS, HTML5, CSS3 for cross-platform
development Avoids each mobile platform’s development language Cordova will create XCode and/or Android Studio
projects You can run the app via the Cordova CLI or launch the
IDE
Where does Cordova fall short?
Interactions, look, and feel are lacking Cordova is simply the engine; you still need to write
your custom UI css files to match platform’s specific look and feel
Basically strips the browser window and gives you a full screen browser view port
…And that’s where Ionic comes in.
About Ionic
Focuses on consistent look, feel, and UI interaction Loosely comparable to BootStrap Heavy on AngularJS actionSheet -> CSS
Advantages of Hybrid
Targets the largest amount of devices with the smallest code base
Creates an App that you can publish in the App Stores
Easier to maintaino Let Cordova, Ionic, and other JavaScript libraries handle
breaking changes
Advantages of Hybrid: Rapid Prototyping
Write one view Run it on all platforms
Chrome
iOS Android
Advantages of Hybrid: Utilize JavaScript Libraries
Shortfalls of Hybrid
Need to hire JS, HTML5, AngularJS developers Look and feel is static (Is it a shortfall?) Performance will never be as good as native Device-specific configurations
o Might require freelance or consulting work Documentation can be lacking
Native App Development
Advantages of Native iOS
Performanceo Highest ceiling for performanceo Natural look and feel
Device Featureso Directly access device features and
services via APIo Easily provide appropriate interfaces
depending on device
Advantages of Native iOS: Development & Debugging Utilize Native IDE and Development tools
o Built-in GIT support Documentation Easier to debug code
o Compiled versus interpreted code $99 a year for iOS Developer Account
Shortfalls of Native iOS
Specific developer skill set required Target only one market Competing languages
Highest development cost
Objective C Swift
Real World Sample
GrapeCity Controls Used in our Demo Apps
Wijmo (Web/Hybrid)
• JavaScript UI Controls • Zero dependencies• Focus on performance• Small core controls and extensible• Offer additional features as optional
extensions
(Native)
Native iOS and Android controls Uses the same API across all platforms Focus on touch first experience Provides expressive animations for loading,
updating, and selecting data
Conclusion: Which Solution is Best?
It depends on your needs.
Hybrid Low barrier to entry Least expensive to
develop Biggest target market
and audience
Native Best end user
experience Requires most specific
developer skills Most expensive to
develop and maintain Targets single market
Contact Information
Wijmo Forumswww.wijmo.com/forums/
Xuni Forumswww.goxuni.com/forums/
Ross DedererDeveloper [email protected]
Kelley RickerDeveloper [email protected]