Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
Bolzano - July 23, 2010


                           Non-Invasive Personal Tracking
                           Andrea Gira...
OVERVIEW


    1. Cloud Web Applications




    2. SproutCore




    3. AppAware Analytics
OVERVIEW


    1. Cloud Web Applications




    2. SproutCore




    3. AppAware Analytics
CLOUD WEB APPLICATIONS
 Migrate to the Cloud

 • Tendency to migrate from desktop applications to web
   applications on t...
CLOUD WEB APPLICATIONS
 Migrate to the Cloud

 • Tendency to migrate from desktop applications to web
   applications on t...
CLOUD WEB APPLICATIONS
 Cloud Computing
                              cloud services revenue (billions of $)
         150
...
CLOUD WEB APPLICATIONS
 Cloud Computing
                              cloud services revenue (billions of $)
         150
...
CLOUD WEB APPLICATIONS
  Desktop vs Web Applications




                              Data   Business
                   ...
CLOUD WEB APPLICATIONS
  Desktop vs Web Applications




                              Business
                          ...
CLOUD WEB APPLICATIONS
  Desktop vs Web Applications




                              Data   Business
                   ...
CLOUD WEB APPLICATIONS
 Main Aspects

 • hybrid between traditional desktop applications and
      traditional web applica...
CLOUD WEB APPLICATIONS
 Main Aspects

 • hybrid between traditional desktop applications and
      traditional web applica...
OVERVIEW


    1. Cloud Web Applications




    2. SproutCore




    3. AppAware Analytics
SPROUTCORE
 In a nutshell

           SproutCore is an HTML5 application
        framework for building responsive, deskto...
SPROUTCORE
 Structure
                 Browser




             V


             C


             M


                  RE...
SPROUTCORE
 Isn’t it Ajax?


 • jQuery and Prototype are utility
    libraries;


 • SproutCore has more in common
    wit...
SPROUTCORE
 Isn’t it Ajax?


 • jQuery and Prototype are utility
    libraries;


 • SproutCore has more in common
    wit...
SPROUTCORE
 Interaction with servers

 • Connection using REST interface;
                                            Brow...
SPROUTCORE
 Interaction with servers

 • Connection using REST interface;
                                            Brow...
SPROUTCORE
 Mautre?

 • Young Framework;
  •   Development started in 2007;
  •   First stable release March 2010;
  •   I...
OVERVIEW


    1. Cloud Web Applications




    2. SproutCore




    3. AppAware Analytics
APPAWARE ANALYTICS
 AppAware Project


       AppAware is a mobile application that tracks
           installations, updat...
APPAWARE ANALYTICS
  AppAware ! AppAware Analytics
• poor statistics pages;
• from February 2010 collected more than 5 mil...
APPAWARE ANALYTICS
  AppAware ! AppAware Analytics
• Prototype ! AppAware Analytics
• main requirements:
   1. create a cl...
APPAWARE ANALYTICS
  Client-Server interaction

1. first access
APPAWARE ANALYTICS
  Client-Server interaction

1. first access
APPAWARE ANALYTICS
  Client-Server interaction

1. first access

2. load apps
APPAWARE ANALYTICS
  Client-Server interaction

1. first access     GET /apps.php

2. load apps
APPAWARE ANALYTICS
  Client-Server interaction

1. first access     GET /apps.php

2. load apps


                         ...
APPAWARE ANALYTICS
  Client-Server interaction

1. first access

2. load apps

3. select an app
  load events of
  current ...
APPAWARE ANALYTICS
  Client-Server interaction

1. first access     GET /events.php

2. load apps

3. select an app
  load ...
APPAWARE ANALYTICS
  Client-Server interaction

1. first access     GET /events.php

2. load apps

3. select an app
  load ...
APPAWARE ANALYTICS
  Client-Server interaction

1. first access

2. load apps

3. select an app
  load events of
  this wee...
APPAWARE ANALYTICS
  Client-Server interaction

1. first access

2. load apps

3. select an app
  load events of
  this wee...
APPAWARE ANALYTICS
  Client-Server interaction

1. first access

2. load apps

3. select an app
  load events of
  this wee...
APPAWARE ANALYTICS
  Client-Server interaction

1. first access

2. load apps

3. select an app
  load events of
  this wee...
APPAWARE ANALYTICS
 Development - Chart Views
APPAWARE ANALYTICS
 Development - Chart Views
APPAWARE ANALYTICS
 Development - Chart Views
APPAWARE ANALYTICS
 Development - Chart Views
APPAWARE ANALYTICS
 Development - Chart Views
APPAWARE ANALYTICS
 Development - Chart Views
APPAWARE ANALYTICS
 Development - Date Selector
APPAWARE ANALYTICS
 Problems

 • AppAware Analytics:
  • too many events/model data!

  • difficult mobile support (because...
APPAWARE ANALYTICS
 Problems

 • SproutCore:
  • bad documentation;

  • poor examples;

  • support only on newsgroup, bl...
APPAWARE ANALYTICS
 Conclusions

            Can web applications compete with
                  desktop applications?


 ...
APPAWARE ANALYTICS
 Conclusions

           Can web applications compete with
                 desktop applications?


 • ...
APPAWARE ANALYTICS
 Future Works

 • Increase client-server REST interface to reduce data
   and bandwidth usage;

 • Offli...
?
speaker: David Saitta
CLOUD WEB APPLICATIONS
 Cloud Computing

                  A style of Computing where
             scalable and elastic IT...
EXTRA
 JavaScript Engines



           WebKit 3.0        5,4




           WebKit 3.1              18,8




          Sq...
CLOUD WEB APPLICATIONS
 Evolution of Web Technologies
CLOUD WEB APPLICATIONS
 Evolution of Web Technologies
  Static pages
  of hyperlinks



     HTML




    1991
CLOUD WEB APPLICATIONS
 Evolution of Web Technologies
  Static pages       Dynamic
  of hyperlinks   generated pages


   ...
CLOUD WEB APPLICATIONS
 Evolution of Web Technologies
  Static pages       Dynamic                 Dynamic MVC
  of hyperl...
CLOUD WEB APPLICATIONS
 Evolution of Web Technologies
  Static pages       Dynamic                 Dynamic MVC            ...
CLOUD WEB APPLICATIONS
 Evolution of Web Technologies
  Static pages       Dynamic                 Dynamic MVC            ...
CLOUD WEB APPLICATIONS
 Evolution of Web Technologies
  Static pages       Dynamic                 Dynamic MVC            ...
APPAWARE ANALYTICS
  Development - REST

• server-side REST interfaces
 • caching system to handle thousands of single eve...
APPAWARE ANALYTICS
  Client-Server interaction

1. first access

2. load apps

3. select an app
  load events of
  this wee...
APPAWARE ANALYTICS
  Client-Server interaction

1. first access       GET /events.php

2. load apps

3. select an app
  loa...
APPAWARE ANALYTICS
 Development - Google Map Views
APPAWARE ANALYTICS
 Development - Google Map Views
SPROUTCORE
 Structure

 • Full-stack MVC framework;
 • Key-Value Coding (KVC);            Browser


 • Key-Value Observing...
Cloud web applications: the new perspective of sproutcore
Cloud web applications: the new perspective of sproutcore
Upcoming SlideShare
Loading in …5
×

Cloud web applications: the new perspective of sproutcore

2,380 views

Published on

Published in: Technology
  • Be the first to comment

Cloud web applications: the new perspective of sproutcore

  1. 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. 2. OVERVIEW 1. Cloud Web Applications 2. SproutCore 3. AppAware Analytics
  3. 3. OVERVIEW 1. Cloud Web Applications 2. SproutCore 3. AppAware Analytics
  4. 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. 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. 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. 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. 8. CLOUD WEB APPLICATIONS Desktop vs Web Applications Data Business Logic Desktop Application Data Business Logic Web Application
  9. 9. CLOUD WEB APPLICATIONS Desktop vs Web Applications Business Logic Desktop Application Data Cloud Web Application Web Application
  10. 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. 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. 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. 13. OVERVIEW 1. Cloud Web Applications 2. SproutCore 3. AppAware Analytics
  14. 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. 15. SPROUTCORE Structure Browser V C M REST
  16. 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. 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. 18. SPROUTCORE Interaction with servers • Connection using REST interface; Browser • Server-agnostic; • DataSource interface to be implemented • fetch, retrieveRecord, createRecord, updateRecord, destroyRecord REST
  19. 19. SPROUTCORE Interaction with servers • Connection using REST interface; Browser • Server-agnostic; • DataSource interface to be implemented • fetch, retrieveRecord, createRecord, updateRecord, destroyRecord REST
  20. 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. 21. OVERVIEW 1. Cloud Web Applications 2. SproutCore 3. AppAware Analytics
  22. 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. 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. 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. 25. APPAWARE ANALYTICS Client-Server interaction 1. first access
  26. 26. APPAWARE ANALYTICS Client-Server interaction 1. first access
  27. 27. APPAWARE ANALYTICS Client-Server interaction 1. first access 2. load apps
  28. 28. APPAWARE ANALYTICS Client-Server interaction 1. first access GET /apps.php 2. load apps
  29. 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. 30. APPAWARE ANALYTICS Client-Server interaction 1. first access 2. load apps 3. select an app load events of current week
  31. 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. 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. 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. 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. 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. 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. 37. APPAWARE ANALYTICS Development - Chart Views
  38. 38. APPAWARE ANALYTICS Development - Chart Views
  39. 39. APPAWARE ANALYTICS Development - Chart Views
  40. 40. APPAWARE ANALYTICS Development - Chart Views
  41. 41. APPAWARE ANALYTICS Development - Chart Views
  42. 42. APPAWARE ANALYTICS Development - Chart Views
  43. 43. APPAWARE ANALYTICS Development - Date Selector
  44. 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. 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. 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. 47. APPAWARE ANALYTICS Conclusions Can web applications compete with desktop applications? • Yes/No: HTML5 is not fully standardized; • No: interaction with custom hardware;
  48. 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.
  49. 49. ? speaker: David Saitta
  50. 50. 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;
  51. 51. 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
  52. 52. CLOUD WEB APPLICATIONS Evolution of Web Technologies
  53. 53. CLOUD WEB APPLICATIONS Evolution of Web Technologies Static pages of hyperlinks HTML 1991
  54. 54. CLOUD WEB APPLICATIONS Evolution of Web Technologies Static pages Dynamic of hyperlinks generated pages CGI PHP HTML ASP HTML HTML HTML 1991 1993-1994
  55. 55. 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
  56. 56. 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
  57. 57. 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
  58. 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 Better Browser Support HTML5/CSS3 JavaScript Engines W3C Standards
  59. 59. 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%
  60. 60. 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
  61. 61. 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
  62. 62. APPAWARE ANALYTICS Development - Google Map Views
  63. 63. APPAWARE ANALYTICS Development - Google Map Views
  64. 64. 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

×