INTRO TO CROSSPLATFORM DEVELOPMENT COMPSCI 732 SOFTENG 750

  • Slides: 30
Download presentation
INTRO TO CROSSPLATFORM DEVELOPMENT COMPSCI 732 / SOFTENG 750 – PART TWO, LECTURE ONE

INTRO TO CROSSPLATFORM DEVELOPMENT COMPSCI 732 / SOFTENG 750 – PART TWO, LECTURE ONE Disclaimer: All images in this slide deck are used under the fair-use policy and remain © their respective copyright holders.

AGENDA • Remaining assessments • Learning outcomes for part two • Course outline for

AGENDA • Remaining assessments • Learning outcomes for part two • Course outline for part two • Intro to cross-platform development • • • What do we mean by “cross-platform” in this course? Why would we do it? (and why wouldn’t we do it? ) How could we do it? What are some techniques and trade -offs? • Intro to cross-platform testing • • What are some difficulties with this? How can we overcome them with tool support?

ASSESSMENT Deliverable Worth Due date Project proposal 5% Monday March 19 th, 7 pm

ASSESSMENT Deliverable Worth Due date Project proposal 5% Monday March 19 th, 7 pm Implementation 20% Sunday April 29 th, 7 pm Peer reviews 3% Monday May 7 th, 7 pm Report 15% Sunday May 20 th, 7 pm Presentation & Demo 7% During weeks 9 – 12 Assignment 1 5% Monday March 26 th, 7 pm Assignment 2 5% Sunday May 27 th, 7 pm Exam 40% Tuesday June 19 th, 2. 15 pm (TBC) Just under two more weeks!

LEARNING OUTCOMES (PART TWO) After successful completion of the course, you will be able

LEARNING OUTCOMES (PART TWO) After successful completion of the course, you will be able to: • Apply advanced source code management techniques to understand manage change in projects. • Apply advanced techniques to make collaboration work smoothly on a technical and design level. • Apply advanced static analysis techniques and type concepts to improve software design. • Describe the challenges involved with developing cross-platform applications, identify solutions to those challenges, and compare & contrast those solutions. • Develop complex cross-platform applications using their choice of language and tool suite. • Understand the importance of system testing across a wide range of heterogeneous devices. • Use appropriate tools to ease the process of multi-device testing.

COURSE OUTLINE (PART TWO) • Six lectures (including today) • One assignment, worth 5%,

COURSE OUTLINE (PART TWO) • Six lectures (including today) • One assignment, worth 5%, due May 27 th • Lecture More info to come later, but will involve development of a simple cross-platform app, similar to the in-lecture examples. Content Lecture One (April 17 th) Introduction to part two (today’s lecture!) Lecture Two (April 20 th) Building with Web technologies & Phone. Gap / Cordova Lecture Three (April 24 th) Building with Native. Script Lecture Four (April Building with React Native 27 th) After that, it’s over to you! Lecture Five (May 1 st) Building with Xamarin

CROSS-PLATFORM DEVELOPMENT • Cross-platform definition: “able to be used on different types of computers

CROSS-PLATFORM DEVELOPMENT • Cross-platform definition: “able to be used on different types of computers or with different software packages” • Common modern examples: • • • Mac vs PC vs Linux Xbox vs Play. Station vs PC Android vs i. OS (vs Windows vs Web…) • In this course, we focus on Android and i. OS: “Development of a single codebase which – as much as possible – can be reused when deploying to Android, i. OS, and possibly other devices”

WHY CROSS-PLATFORM? • Market reach • Time saving • Leverage existing skillsets

WHY CROSS-PLATFORM? • Market reach • Time saving • Leverage existing skillsets

CROSS-PLATFORM – MARKET REACH

CROSS-PLATFORM – MARKET REACH

CROSS-PLATFORM – MARKET REACH Worldwide mobile platform market share, March 2018 Android i. OS

CROSS-PLATFORM – MARKET REACH Worldwide mobile platform market share, March 2018 Android i. OS Other US mobile platform market share, March 2018 Android i. OS Other Source: http: //gs. statcounter. com/os-market-share/mobile/worldwide

CROSS-PLATFORM – TIME SAVING • Time taken to develop a mobile app for a

CROSS-PLATFORM – TIME SAVING • Time taken to develop a mobile app for a single platform • Usually on the order of months (four to six months is commonly quoted, though this varies greatly on a case-bycase basis) • This is just for one platform! • Expect to double this value – or more – if developing native applications for two platforms • Code reuse can significantly reduce the time taken to develop for multiple platforms • And as we all know, =

CROSS-PLATFORM – LEVERAGING SKILLSETS • We might have a development team proficient in a

CROSS-PLATFORM – LEVERAGING SKILLSETS • We might have a development team proficient in a certain technology stack – e. g. HTML 5 / CSS / JS • We may even have existing resources using that stack which we’d like to reuse • With appropriate selection of a crossplatform development environment, we can: • Allow developers to leverage the skills they already have without the need to learn new languages • Reuse existing assets

WHY NOT CROSS-PLATFORM? Pros • Market reach • Time saving • Leveraging existing skillsets

WHY NOT CROSS-PLATFORM? Pros • Market reach • Time saving • Leveraging existing skillsets Cons • Performance • Compromise • Learning new tools • Testing / debugging…

PLATFORM DIFFERENCES i. OS Android Primary languages Objective-C, Swift Java Other languages C, C++

PLATFORM DIFFERENCES i. OS Android Primary languages Objective-C, Swift Java Other languages C, C++ Primary artefacts Views, View Controllers Activities, Services UI Framework Cocoa Touch (unnamed) Background processing Extremely limited Open Design language i. OS Design Themes Material Design Dev environment XCode / Mac Android Studio (most common) These are fundamentally different platforms! How can we write code that will run on both? (or even more) Deployment Apple Store Google Play Store … article: https: //www. androidauthority. com/developing-for-android-vs-ios-697304/ … … excellent

CATEGORIES Four broad categories: • Web applications • Hybrid applications • Cross-compiled applications •

CATEGORIES Four broad categories: • Web applications • Hybrid applications • Cross-compiled applications • Domain-specific applications

WEB APPS • Makes use of an amazing piece of software available on all

WEB APPS • Makes use of an amazing piece of software available on all relevant devices – the web browser! • Modern web technology designed to easily support heterogeneous screen resolutions & device capabilities

WEB APPS – PROS & CONS Pros • Web browsers already available on all

WEB APPS – PROS & CONS Pros • Web browsers already available on all relevant devices • CSS support for differences in screen resolution • Perfectly leverages existing web design skill • Large number of CSS & JS frameworks available with excellent documentation • “Free” support for arbitrary platforms (as long as a suitable browser exists) Cons • Difficulties accessing native APIs (though some e. g. location services are now supported) • • Slow! • Difficult to match native look & feel • Can’t distribute through app stores • Lacks “sex appeal” of apps Dependent on available network connection

HYBRID APPS • A term for a wide range of application types which attempt

HYBRID APPS • A term for a wide range of application types which attempt to bridge the gap between web and native development • At their simplest, this could simply involve packaging a web app so it can be deployed to various app stores • Can be much more complex, allowing for native UI and API use. Web. View container WVC with Native APIs Increasing ease-of-use & transferrable Java. Script + Native APIs Native UI support Frameworks e. g. React, Angular… Increasing complexity &

HYBRID APPS – WEB VIEWS 1. Developers write web apps using HTML 5 /

HYBRID APPS – WEB VIEWS 1. Developers write web apps using HTML 5 / CSS / JS 2. Tool packages your artefacts into packages for target platforms 3. Can be deployed to phones through app stores 4. Some tools allow use of JS “native” APIs to allow access to mobilespecific features (e. g. accelerometer) Example tools: i. OS IPA Android APK

WEB VIEWS – PROS & CONS Pros • Many of the pros of standard

WEB VIEWS – PROS & CONS Pros • Many of the pros of standard webapps (leveraging skillsets & existing frameworks) • Not reliant on network • Java. Script plugin support for some native APIs – enables functionality not possible with standard webapps • Distribution via app stores Cons • Still slow! (though now bottlenecks are CPU / memory rather than network) • Still difficult to achieve native look & feel • Distribution via app stores – now subject to design guidelines (maybe harsh, especially for i. OS)

HYBRID APPS – JAVASCRIPT + NATIVE UI 1. Developers write Java. Script code (usually

HYBRID APPS – JAVASCRIPT + NATIVE UI 1. Developers write Java. Script code (usually using a JS framework such as Angular or React) 2. JS APIs are made available to access native features and to create native UI components 3. Custom JS APIs can be written by developers to enable additional platform-specific features 4. Artefacts are packaged into native containers along with a JS runtime component to execute developer code and a bridging component to execute native code. These can then be published to app stores. Example tools: i. OS IPA Android APK

JAVASCRIPT + NATIVE API – PROS & CONS Pros • Faster than web views

JAVASCRIPT + NATIVE API – PROS & CONS Pros • Faster than web views (only require JS engine rather than entire browser as overhead) • Native look and feel Cons • Steeper learning curve (though it helps to pick a tool where you’re already familiar with the base framework – Angular vs React)

CROSS-COMPILED APPS Developer 1. Developers write code in some language (which may or may

CROSS-COMPILED APPS Developer 1. Developers write code in some language (which may or may not be the native language of a target platform) 2. The language provides access to all required native APIs 3. A tool cross-compiles code into either: 4. • Machine language for a target platform; or • Bytecode to run on a VM within the target platform; or • A high-level language (e. g. Java) which can then be further compiled to run on the target platform Cross-compilation method may differ from platform to platform Example tool: • Xamarin code Native APIs sout( “Hello World”); Bytecode + platform VM asm 0 asm 1 asm 2 … Intermediary language 0000101 1101110 0011101 101… Machine code for target platform

CROSS-COMPILED APPS – PROS & CONS Pros • Potentially even faster than Java. Script-based

CROSS-COMPILED APPS – PROS & CONS Pros • Potentially even faster than Java. Script-based apps – can approach the speeds of fully native apps • Native look and feel • Can use a “real” programming language Cons • Unable to leverage existing web development skill • May need to learn entirely new platform • Potentially less traceability between developer artefacts and final output

DOMAIN-SPECIFIC APPS • The idea is that if you restrict the types of apps

DOMAIN-SPECIFIC APPS • The idea is that if you restrict the types of apps a tool can create, then you’ll be able to optimize much better for the apps you do care about. • Common for domain-specific tools to come with visual languages, which significantly reduce the amount of code required of developers – or eliminates the need for code entirely! Examples • Microsoft Power. Apps • Unity

DOMAIN-SPECIFIC – PROS & CONS Pros • Great performance • Usually enable more rapid

DOMAIN-SPECIFIC – PROS & CONS Pros • Great performance • Usually enable more rapid prototyping / engineering • Extensive tool support • Sometimes possible for non-developers Cons • Very restrictive – you can’t just build any kind of app with these tools • Even within the specific domain, customization may be difficult

TESTING • In general, how an app can be tested varies greatly depending on

TESTING • In general, how an app can be tested varies greatly depending on the specific cross-platform technology used • We’ll cover testing for specific technologies in their respective lectures • Generally, two kinds of testing we’ll look at: • • Unit testing System / Acceptance testing

UNIT TESTING • Definition: “Unit testing is a software development process in which the

UNIT TESTING • Definition: “Unit testing is a software development process in which the smallest testable parts of an application, called units, are individually and independently scrutinized for properation. Unit testing can be done manually but is often automated. ” • Native app developers have access to the full unit testing suites of their respective platforms. Do cross -platform developers have similar tool support? • Yes – all widely used cross-platform tools have unit testing support.

SYSTEM / ACCEPTANCE TESTING • Definition: “System testing is a level of software testing

SYSTEM / ACCEPTANCE TESTING • Definition: “System testing is a level of software testing where a complete and integrated software is tested. The purpose of this test is to evaluate the system’s compliance with the specified requirements. ” • For cross-platform development we need to test whether the app meets the requirements on all target platforms • All widely-used tools support deployment to simulators and / or real devices for manual testing • We can also automate this kind of testing • Free tools such as Calabash and Appium allow us to programmatically control device UIs to check they respond correctly • Paid tools such as Amazon AWS Device Farm allow automated testing on thousands of concurrent devices in the cloud

SUMMARY • Cross-platform mobile development is attractive due to the potential for increased market

SUMMARY • Cross-platform mobile development is attractive due to the potential for increased market reach, time saving, and the ability to leverage existing developer skills. • There are many ways to develop cross-platform apps, ranging from web technologies to crosscompilation to domain-specific languages. Each has benefits and drawbacks. • Unit testing and system / acceptance testing are possible during cross-platform development with appropriate tool support (though perhaps not as simple as for native development).

USEFUL RESOURCES • Mobile platform usage statistics • Responsive web application development • Getting

USEFUL RESOURCES • Mobile platform usage statistics • Responsive web application development • Getting started with Phone. Gap • Getting started with Native. Script • Getting started with React Native • Getting started with Xamarin • Calabash • Appium