Slides of my keynote at the Mobile! 2016 workshop, co-located with SPLASH 2016 , Amsterdam.
This keynote talk provides a state-of-the-art overview of the development strategies and technologies for developing mobile apps, each of them with its own advantages and drawbacks. In this context, the use of web technologies is discussed as a promising investment for moving forward one of the most intriguing challenges in the world of mobile apps: its fragmentation with respect to mobile platforms (e.g., Android, Apple iOS, Windows Phone). A discussion of research challenges, and thus opportunities, close the talk.
8. VRIJE
UNIVERSITEIT
AMSTERDAM
• fast development
• simple maintenance and updates
• cross-platform
• 2-steps access
– they are launched via a browser
• do not work offline
• no background activities
– e.g. geofencing
• poor access to system APIs
– e.g. push notifications, contacts, etc.
Web apps
PROS
CONS
11. VRIJE
UNIVERSITEIT
AMSTERDAM
Example of API usage
var options = {
enableHighAccuracy: true,
maximumAge: 3000,
timeout: 5000
};
navigator.geolocation.getCurrentPosition(win, fail, options);
function win(pos) {
var el = ‘<div>Latitude: ‘ + pos.coords.latitude + '</div>’;
el += ‘<div>Longitude: ‘ + pos.coords.longitude + '</div>’;
el += ‘<div>timestamp: ‘ + pos.timestamp + '</div>’;
$(‘#block’).html(el);
}
function fail(err) {
console.log(err.code);
}
http://i0.wp.com/www.phonegap.co.in/wp-content/uploads/2015/07/device_axes.jpg
12. VRIJE
UNIVERSITEIT
AMSTERDAM
Where are hybrid mobile apps?
What is the difference between hybrid and
native mobile apps as perceived by end users?
Developer
End users
creates download
& use
App
STUDY 1
[S1]
STUDY 2
[S2]
Are hybrid mobile apps published in the Google Play
Store? What are their main traits?S1
S2
13. VRIJE
UNIVERSITEIT
AMSTERDAM
We analysed hybrid mobile apps
• in their actual context of use
• with a reproducible empirical strategy
– dataset comprising 11,917 real apps
and 3,041,315 user reviews
– dedicated analysis process and tool
Design of the study
Complete replication packages:
• http://cs.gssi.infn.it/ms_2015
• http://cs.gssi.infn.it/hybrid googleplay analysis
Analysis tool : http://github.com/GabMar/ApkCategoryChecker
15. VRIJE
UNIVERSITEIT
AMSTERDAM
Web-based hybrid apps
• cross-platform portability
• reuse of existing knowledge of web
developers
• simpler and less expensive development
process
• inherit some cons of native apps
• restricted access to system APIs
• (slight) decrease in performance
PROS
CONS
18. VRIJE
UNIVERSITEIT
AMSTERDAM
The journey of a PWA
1. The user accesses the website as usual
2. After the 3rd-4th visit, the website asks
to be installed
https://goo.gl/KIZydg
19. VRIJE
UNIVERSITEIT
AMSTERDAM
The journey of a PWA
1. The user accesses the website as usual
2. After the 3rd-4th visit, the website asks
to be installed
3. The user can decide to add the app to
the home screen
https://goo.gl/KIZydg
20. VRIJE
UNIVERSITEIT
AMSTERDAM
The journey of a PWA
1. The user accesses the website as usual
2. After the 3rd-4th visit, the website asks
to be installed
3. The user can decide to add the app to
the home screen
4. From now on, the app is top-level, full-
screen, and can receive push
notifications
https://goo.gl/KIZydg
21. VRIJE
UNIVERSITEIT
AMSTERDAM
Components of a PWA
HTTPS
Web
Manifest
Service
workers
{
"name": "MyApplication",
"short_name": "MyApp",
"scope": "./webApp/",
"orientation": "portrait",
"display": "fullscreen",
"background_color": "#fff",
"description": "A simple application for testing.",
"icons": [{
"src": "images/touch/homescreen48.png",
"sizes": "48x48",
"type": "image/png"
}, ...
}],
...
}
22. VRIJE
UNIVERSITEIT
AMSTERDAM
Service worker
Implemented in JavaScript
Multithreading
→ it runs in a separate thread w.r.t.
the main thread
Used for:
• content caching
– offline functionality
• push notifications
• background operations
24. VRIJE
UNIVERSITEIT
AMSTERDAM
Progressive web apps
• cross-platform portability
• based on Web standards
• offline support + caching
• background operations
• access to system APIs
– work in progress
• first access in 2 steps
• no visibility in the stores
• not yet supported by Safari and IE
PROS
CONS
BROWSER
<html>
<head>
<script src=” ...” />
</head>
<body>
...
Service
workers
26. VRIJE
UNIVERSITEIT
AMSTERDAM
Investigate on quality properties
A. I. Wasserman. Software Engineering Issues for Mobile Application Development. In Proceedings of the FSE/SDP
Workshop on Future of Software Engineering Research, pages 397–400, 2010.
MobileSoft 2016
28. VRIJE
UNIVERSITEIT
AMSTERDAM
• cache state
– eg, cold vs warm vs hot cache
• 2G vs wi-fi
• low-end vs high-end devices
• different browsers
PWAs not investigated yet
… and on energy consumption?
What is the impact of service workers performance?
29. VRIJE
UNIVERSITEIT
AMSTERDAM
How the actual users perceive mobile apps on different platforms?
Cross-platform studies
Focus on
• difference of ratings across stores (Google Play vs Apple)
• difference of perceptions across user bases
– value
– performance
– bugginess
• difference of performance or energy consumption across
platforms?
What are the traits of (hybrid) apps on different platforms?
30. VRIJE
UNIVERSITEIT
AMSTERDAM
• Alexa’s top 1M
– http://www.alexa.com/topsites
• Awesome PWA
– http://github.com/hemanth/awesome-pwa
• PWA Rocks
– https://pwa.rocks
• Alexa’s top 1M
Where can I find web-based mobile
apps?
Web apps
Progressive web apps
31. VRIJE
UNIVERSITEIT
AMSTERDAM
Where can I find web-based mobile
apps?
Hybrid apps
• Existing datasets dedicated to hybrid apps
– http://cs.gssi.infn.it/hybrid_googleplay_analysis
• App store mining + hybrid apps identifier
MobileSoft 2015
32. VRIJE
UNIVERSITEIT
AMSTERDAM
PROBLEM 1: mining app stores returns only the LATEST version of
the app
à SOLUTION: find some repo in GitHub with all the past
versions of the code
à PROBLEM 2: many toy or dismissed apps
à SOLUTION: search apps that are in BOTH GitHub
and app stores!
GitHub + App store mining
ICSME 2016
33. VRIJE
UNIVERSITEIT
AMSTERDAM
Conclusions
VRIJE
UNIVERSITEIT
AMSTERDAM
Fragmentation
Objective
-C
code
Swift
code
XCode
Java
code
C++
code
Eclipse
C#
code
C++
code
Visual Studio
JS
code
VRIJE
UNIVERSITEIT
AMSTERDAM
PROBLEM 1: mining app stores returns only the LATEST version of
the app
à SOLUTION: find some repo in GitHub with all the past
versions of the code
à PROBLEM 2: many toy or dismissed apps
à SOLUTION: search apps that are in BOTH GitHub
and app stores!
GitHub + App store mining
ICSME 2016
VRIJE
UNIVERSITEIT
AMSTERDAM
BROWSER
<html>
<head>
<script src=” ...” />
</head>
<body>
...
NATIVE
WRAPPER
<html>
<head>
<script src=” ...” />
</head>
<body>
...
PLATFORM APIs
NATIVE
APP
01010101010101101010
1010101011011010
010101010101011101
010101010101011010
PLATFORM APIs
Native Web
Hybrid
Progressive web apps
Progressive
BROWSER
<html>
<head>
<script src=” ...” />
</head>
<body>
...
Service
workers
VRIJE
UNIVERSITEIT
AMSTERDAM
Investigate on quality properties
A. I. Wasserman. Software Engineering Issues for Mobile Application Development. In Proceedings of the FSE/SDP
Workshop on Future of Software Engineering Research, pages 397–400, 2010.
MobileSoft 2016
35. VRIJE
UNIVERSITEIT
AMSTERDAM
References
Ivano Malavolta. Web-based hybrid mobile apps: state of the practice and
research opportunities. International Conference on Mobile Software
Engineering and Systems (MOBILESoft), Austin, Texas, USA, May 14-22,
2016, pp. 241–242.
M.E.Joorabchi,A.Mesbah,andP.Kruchten. Real Challenges in Mobile App
Development. In ESEM, 2013.
A. I. Wasserman. Software Engineering Issues for Mobile Application
Development. In Proceedings of the FSE/SDP Workshop on Future of
Software Engineering Research, pages 397–400, 2010.
[S1] Ivano Malavolta, Stefano Ruberto, Valerio Terragni, Tommaso Soru.
Hybrid Mobile Apps in the Google Play Store: an Exploratory Investigation.
International Conference on Mobile Software Engineering and Systems
(MOBILESoft), ACM, 2015.
[S2] Ivano Malavolta, Stefano Ruberto, Valerio Terragni, Tommaso Soru.
End Users' Perception of Hybrid Mobile Apps in the Google Play
Store. IEEE International conference on Mobile Services (MS), IEEE, 2015.