This document summarizes a thesis on AppAware Analytics. It discusses developing a cloud web application using SproutCore to provide analytics on mobile app usage data collected by the AppAware project. Key points include: 1. The application aims to minimize server-side computation and bandwidth usage by handling most processing in the browser. 2. It uses a REST interface to retrieve app and event data from the server in JSON format. 3. Challenges include the large amount of event data and lack of support for caching computed charts on the client-side. The document evaluates if web applications can compete with desktop applications, concluding it is possible for advanced interactions but performance may suffer with large data transfers.

1. Bolzano - July 23, 2010
Non-Invasive Personal Tracking
Andrea Girardello
CLOUD WEB APPLICATIONS:
Thesis supervisor: Prof. Giancarlo Succi
THE NEW PERSPECTIVE OF S PROUT C ORE
T HE A PP A WARE A NALYTICS
Bolzano, 24 July 2009
DEVELOPMENT OF
DAVID SAITTA
Thesis Supervisor: Thesis Co-Supervisor:
Prof. Ernesto Damiani Prof. Paolo Ceravolo

2. OVERVIEW
1. Cloud Web Applications
2. SproutCore
3. AppAware Analytics

3. OVERVIEW
1. Cloud Web Applications
2. SproutCore
3. AppAware Analytics

4. CLOUD WEB APPLICATIONS
Migrate to the Cloud
• Tendency to migrate from desktop applications to web
applications on the Cloud;
• Software as a Service;
• Software developed using web technologies;

5. CLOUD WEB APPLICATIONS
Migrate to the Cloud
• Tendency to migrate from desktop applications to web
applications on the Cloud;
• Software as a Service;
• Software developed using web technologies;

6. CLOUD WEB APPLICATIONS
Cloud Computing
cloud services revenue (billions of $)
150
148,8
↑+117.8%
112,5
75
68,3
58,6 ↑+16.6%
37,5
0
2009 2010 2014
Gartner report “Forecast: Public Cloud Services, Worldwide and Regions, Industry Sectors, 2009-2014

7. CLOUD WEB APPLICATIONS
Cloud Computing
cloud services revenue (billions of $)
150
148,8
↑+117.8%
112,5
75
68,3
58,6
37,5 Can web applications compete with ↑+16.6%
desktop applications?
0
2009 2010 2014
Gartner report “Forecast: Public Cloud Services, Worldwide and Regions, Industry Sectors, 2009-2014

8. CLOUD WEB APPLICATIONS
Desktop vs Web Applications
Data Business
Logic
Desktop Application
Data Business
Logic
Web Application

9. CLOUD WEB APPLICATIONS
Desktop vs Web Applications
Business
Logic
Desktop Application
Data Cloud Web Application
Web Application

10. CLOUD WEB APPLICATIONS
Desktop vs Web Applications
Data Business
Logic
Business
Desktop Application Logic
Data
Data Business
Logic
Cloud Web Application
Web Application

11. CLOUD WEB APPLICATIONS
Main Aspects
• hybrid between traditional desktop applications and
traditional web applications;
• Like desktop apps
• rich user experience;
• immediate response to user actions;
• offline mode;
• Like web apps
• universal / cross platform;
• not installed on computer;
• take advantage of the Cloud by storing all the data on it;
• mobile access.

12. CLOUD WEB APPLICATIONS
Main Aspects
• hybrid between traditional desktop applications and
traditional web applications;
• Like desktop apps
• rich user experience;
• immediate response to user actions;
• offline mode; tools? Which language? Which
Which structure?
• Like web apps
• universal / cross platform;
• not installed on computer;
• take advantage of the Cloud by storing all the data on it;
• mobile access.

13. OVERVIEW
1. Cloud Web Applications
2. SproutCore
3. AppAware Analytics

14. SPROUTCORE
In a nutshell
SproutCore is an HTML5 application
framework for building responsive, desktop-like
apps in any modern web browser, without plugins.
• Its goal is to allow developers to create web applications
with advanced capabilities and user experiences
• moves business logic to the client;
• applications are full-fledged programs, written in JavaScript that is
executed in the browser;
• freeing up servers (and server engineers) to focus on
delivering data as quickly and reliably as possible.

15. SPROUTCORE
Structure
Browser
V
C
M
REST

16. SPROUTCORE
Isn’t it Ajax?
• jQuery and Prototype are utility
libraries;
• SproutCore has more in common
with Cocoa, .NET or Eclipse Rich
Client Platform;
• The Display layer is based on
jQuery DOM functionalities.

17. SPROUTCORE
Isn’t it Ajax?
• jQuery and Prototype are utility
libraries;
• SproutCore has more in common
with Cocoa, .NET or Eclipse Rich
Client Platform;
• The Display layer is based on
jQuery DOM functionalities.

18. SPROUTCORE
Interaction with servers
• Connection using REST interface;
Browser
• Server-agnostic;
• DataSource interface to be
implemented
• fetch, retrieveRecord, createRecord,
updateRecord, destroyRecord
REST

19. SPROUTCORE
Interaction with servers
• Connection using REST interface;
Browser
• Server-agnostic;
• DataSource interface to be
implemented
• fetch, retrieveRecord, createRecord,
updateRecord, destroyRecord
REST

20. SPROUTCORE
Mautre?
• Young Framework;
• Development started in 2007;
• First stable release March 2010;
• Investmens from Apple Inc.
• Used to develop MobileMe
• Mature core and structure;
• Immature advanced views and documentations;
• Extensible using plugins and frameworks;
• DSUI (http://github.com/d4v1d82/DSUI)

21. OVERVIEW
1. Cloud Web Applications
2. SproutCore
3. AppAware Analytics

22. APPAWARE ANALYTICS
AppAware Project
AppAware is a mobile application that tracks
installations, updates, and removals
of Android programs
• Developed as a research project by Information
Management group at the ETH Zürich

23. APPAWARE ANALYTICS
AppAware ! AppAware Analytics
• poor statistics pages;
• from February 2010 collected more than 5 milions of events
with about 60-70 thousand events for day.

24. APPAWARE ANALYTICS
AppAware ! AppAware Analytics
• Prototype ! AppAware Analytics
• main requirements:
1. create a cloud web application;
2. allow users to easily interact with the system;
3. minimize the server-side computation (i.e. changing chart visualizations, user
interactions, UI modifications, etc.);
4. minimize the bandwidth usage: the server provides only a collection of data
information objects.

25. APPAWARE ANALYTICS
Client-Server interaction
1. first access

26. APPAWARE ANALYTICS
Client-Server interaction
1. first access

27. APPAWARE ANALYTICS
Client-Server interaction
1. first access
2. load apps

28. APPAWARE ANALYTICS
Client-Server interaction
1. first access GET /apps.php
2. load apps

29. APPAWARE ANALYTICS
Client-Server interaction
1. first access GET /apps.php
2. load apps
JSON
[{id: 82,
app_name: "Maps",
package_name: "com.google.android.apps.maps",
meter: 98,
meter_img: "http://chart.apis.google.com/chart?chs=….",
description: "Get the latest release of Google Maps. New features:n*
Bicycling directions and map layer (US only)n* Navigation icon in app
launchern* Share places by email, SMS, and morennAlso includes:n*
Navigation (Beta)n* Search by voicen* My Locationn* Business listingsn*
Directionsn* Trafficn* Street Viewn* Latituden* Google Buzz",
icon: "http://AppAware.org/icons/com.google.android.apps.maps.png"

},
{id: 199,
app_name: "Market",
...

30. APPAWARE ANALYTICS
Client-Server interaction
1. first access
2. load apps
3. select an app
load events of
current week

31. APPAWARE ANALYTICS
Client-Server interaction
1. first access GET /events.php
2. load apps
3. select an app
load events of
current week

32. APPAWARE ANALYTICS
Client-Server interaction
1. first access GET /events.php
2. load apps
3. select an app
load events of JSON
current week
{"events": [{
"id": 3369952,
"event_type": "updated",
"user_id": "2001459694d7346d",
"twitter_id": null,
"model": "HTC Hero",
"sdk": 7,
"latitude": "53.16871628",
"longitude": "-1.11738948",
"created": "2010-06-14 00:17:36"
},{}
]}

33. APPAWARE ANALYTICS
Client-Server interaction
1. first access
2. load apps
3. select an app
load events of
this week
4. navigate graphs

34. APPAWARE ANALYTICS
Client-Server interaction
1. first access
2. load apps
3. select an app
load events of
this week
4. navigate graphs

35. APPAWARE ANALYTICS
Client-Server interaction
1. first access
2. load apps
3. select an app
load events of
this week
4. navigate graphs

36. APPAWARE ANALYTICS
Client-Server interaction
1. first access
2. load apps
3. select an app
load events of
this week
4. navigate graphs

37. APPAWARE ANALYTICS
Development - Chart Views

38. APPAWARE ANALYTICS
Development - Chart Views

39. APPAWARE ANALYTICS
Development - Chart Views

40. APPAWARE ANALYTICS
Development - Chart Views

41. APPAWARE ANALYTICS
Development - Chart Views

42. APPAWARE ANALYTICS
Development - Chart Views

43. APPAWARE ANALYTICS
Development - Date Selector

44. APPAWARE ANALYTICS
Problems
• AppAware Analytics:
• too many events/model data!
• difficult mobile support (because of memory);
• no cache support on computed charts;
2010-7-1 / 2010-7-19 2010-4-1 / 2010-7-19
20 days 110 days
Objects 2,839 27,900
Response Size 508.5KB 5MB
Response Size (gzip) 99.6KB (80.4%) ~1MB (80.5%)
Computation time 1.8sec 25sec

45. APPAWARE ANALYTICS
Problems
• SproutCore:
• bad documentation;
• poor examples;
• support only on newsgroup, blog, comments and IRC with developers;
• HTML5 standard still in draft
• Candidate Recommendation stage during 2012.

46. APPAWARE ANALYTICS
Conclusions
Can web applications compete with
desktop applications?
• Yes: user interaction is responsible as a desktop
application;
• Yes: Advanced views;
• Yes: interaction with multiple servers;
• Yes/No: when exchanging big amount of data with the
server the latency increase (but the same with desktop
application);

47. APPAWARE ANALYTICS
Conclusions
Can web applications compete with
desktop applications?
• Yes/No: HTML5 is not fully standardized;
• No: interaction with custom hardware;

48. APPAWARE ANALYTICS
Future Works
• Increase client-server REST interface to reduce data
and bandwidth usage;
• Offline support;
• Mobile Views;
• Touch Devices support;
• Advanced events filtering;
• Porting to SproutCore 1.1 as soon as released.

50. ?
speaker: David Saitta

52. CLOUD WEB APPLICATIONS
Cloud Computing
A style of Computing where
scalable and elastic IT capabilities are
provided as a service to multiple
customers using Internet technologies.
Gartner
• Software as a Service;
• Software developed using web technologies;

53. EXTRA
JavaScript Engines
WebKit 3.0 5,4
WebKit 3.1 18,8
SquirrelFish 29,9
SquirrelFish Extreme 63,6
0 20 40 60 80
The chart shows WebKit’s JavaScript performance in different versions
bigger bars are better

54. CLOUD WEB APPLICATIONS
Evolution of Web Technologies

55. CLOUD WEB APPLICATIONS
Evolution of Web Technologies
Static pages
of hyperlinks
HTML
1991

56. CLOUD WEB APPLICATIONS
Evolution of Web Technologies
Static pages Dynamic
of hyperlinks generated pages
CGI PHP
HTML ASP
HTML HTML HTML
1991 1993-1994

57. CLOUD WEB APPLICATIONS
Evolution of Web Technologies
Static pages Dynamic Dynamic MVC
of hyperlinks generated pages generated pages
CGI PHP Ruby on Rails
HTML ASP JBoss
ASP.NET
HTML HTML HTML HTML HTML HTML
1991 1993-1994 2001

58. CLOUD WEB APPLICATIONS
Evolution of Web Technologies
Static pages Dynamic Dynamic MVC Dynamic/Static
of hyperlinks generated pages generated pages generated JavaScript
CGI PHP Ruby on Rails HTML
HTML ASP JBoss JavaScrip
ASP.NET
HTML HTML HTML HTML HTML HTML
1991 1993-1994 2001

59. CLOUD WEB APPLICATIONS
Evolution of Web Technologies
Static pages Dynamic Dynamic MVC Dynamic/Static
of hyperlinks generated pages generated pages generated JavaScript
CGI PHP Ruby on Rails HTML
HTML ASP JBoss JavaScrip
ASP.NET
HTML HTML HTML HTML HTML HTML
1991 1993-1994 2001

60. CLOUD WEB APPLICATIONS
Evolution of Web Technologies
Static pages Dynamic Dynamic MVC Dynamic/Static
of hyperlinks generated pages generated pages generated JavaScript
CGI PHP Ruby on Rails HTML
HTML ASP JBoss JavaScrip
ASP.NET
HTML HTML HTML HTML HTML HTML
1991 1993-1994 2001
Better Browser Support
HTML5/CSS3
JavaScript Engines
W3C Standards

61. APPAWARE ANALYTICS
Development - REST
• server-side REST interfaces
• caching system to handle thousands of single events;
• PHP based;
• JSON format;
• GZip compression;
App Google Maps
Date Range April, 18 2010 to
June, 18 2010
Number of Events 10,551
Original Size ~2MB (1922.11 KB)
Gzipped Size 371.38 KB
Data Savings 80.68%

62. APPAWARE ANALYTICS
Client-Server interaction
1. first access
2. load apps
3. select an app
load events of
this week
4. navigate graphs
5. select another
date range

63. APPAWARE ANALYTICS
Client-Server interaction
1. first access GET /events.php
2. load apps
3. select an app
load events of JSON
this week
4. navigate graphs 2010-7-1 / 2010-7-19 2010-4-1 / 2010-7-19
20 days 110 days
Objects
5. select another 2,839 27,900
Response Size 508.5KB 5MB
date range Response Size
99.6KB (80.4%) ~1MB (80.5%)
(gzip)
Computation
1.8sec 25sec
time

64. APPAWARE ANALYTICS
Development - Google Map Views

65. APPAWARE ANALYTICS
Development - Google Map Views

66. SPROUTCORE
Structure
• Full-stack MVC framework;
• Key-Value Coding (KVC); Browser
• Key-Value Observing (KVO);
• Component Bindings;
Controller update value
slider_value
valu
e up 22
date
d
REST