mobile app development hybrid vs native

29
Hybrid vs. Native Mobile App Development

Upload: ross-dederer

Post on 13-Apr-2017

1.466 views

Category:

Technology


0 download

TRANSCRIPT

Page 1: Mobile App Development Hybrid vs Native

Hybrid vs. Native

Mobile App Development

Page 2: Mobile App Development Hybrid vs Native

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

Page 3: Mobile App Development Hybrid vs Native

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)

Page 4: Mobile App Development Hybrid vs Native

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

Page 5: Mobile App Development Hybrid vs Native

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

Page 6: Mobile App Development Hybrid vs Native

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

Page 7: Mobile App Development Hybrid vs Native

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

Page 8: Mobile App Development Hybrid vs Native

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

Page 9: Mobile App Development Hybrid vs Native

Hybrid App Development

Page 10: Mobile App Development Hybrid vs Native

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

Page 11: Mobile App Development Hybrid vs Native
Page 12: Mobile App Development Hybrid vs Native

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

Page 13: Mobile App Development Hybrid vs Native

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.

Page 14: Mobile App Development Hybrid vs Native

About Ionic

Focuses on consistent look, feel, and UI interaction Loosely comparable to BootStrap Heavy on AngularJS actionSheet -> CSS

Page 15: Mobile App Development Hybrid vs Native

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

Page 16: Mobile App Development Hybrid vs Native

Advantages of Hybrid: Rapid Prototyping

Write one view Run it on all platforms

Chrome

iOS Android

Page 17: Mobile App Development Hybrid vs Native

Advantages of Hybrid: Utilize JavaScript Libraries

Page 18: Mobile App Development Hybrid vs Native

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

Page 19: Mobile App Development Hybrid vs Native

Native App Development

Page 20: Mobile App Development Hybrid vs Native

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

Page 21: Mobile App Development Hybrid vs Native

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

Page 22: Mobile App Development Hybrid vs Native

Shortfalls of Native iOS

Specific developer skill set required Target only one market Competing languages

Highest development cost

Objective C Swift

Page 23: Mobile App Development Hybrid vs Native

Real World Sample

Page 24: Mobile App Development Hybrid vs Native

GrapeCity Controls Used in our Demo Apps

Page 25: Mobile App Development Hybrid vs Native

Wijmo (Web/Hybrid)

• JavaScript UI Controls • Zero dependencies• Focus on performance• Small core controls and extensible• Offer additional features as optional

extensions

Page 26: Mobile App Development Hybrid vs Native

(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

Page 27: Mobile App Development Hybrid vs Native

Conclusion: Which Solution is Best?

Page 28: Mobile App Development Hybrid vs Native

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

Page 29: Mobile App Development Hybrid vs Native

Contact Information

Wijmo Forumswww.wijmo.com/forums/

Xuni Forumswww.goxuni.com/forums/

Ross DedererDeveloper [email protected]

Kelley RickerDeveloper [email protected]