KEMBAR78
Mobile HTML5 Web Apps - Codemotion 2012 | PDF
Marco Casario
      CTO – Comtaste
      http://casario.blogs.com


© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
DEVELOPER
DEVELOPER
  DEVELOPER
W ho a m I
© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
WWW.COMTASTE.COM
© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
WWW.COMTASTE.COM
© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
WWW.COMTASTE.COM
http://www.meetup.com/HTML5-Italy/




© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
1                           Mobile Explosion



                         2                             Native apps vs. Web apps



                         3                            PhoneGap, a mobile framework



 © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
WWW.COMTASTE.COM
The explosion of devices introduces new challenges for every
                               organization…




© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Il mobile ha superato il web !




© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Perchè cross-platform?




© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
According to Cisco's report mobile data traffic will grow up to
           1.3EB per month during this year. In 2016, Cisco predicts a
          total of 10.8EB of traffic every month. That's 11.324.620TB.




© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Native Apps
                                               vs.
                                           Web Apps
 © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
WWW.COMTASTE.COM
Le app native sono più POTENTI


         • In termini di UX le native app possono fare molto:
         massima integrazione con l'hardware del device
         • Il Web sta evolvendo velocemente. Vedi il recente
         annuncio del Battery Status API. W3C Working Draft 29
         November 2011

         • Nascita di framework come Phonegap, Titanium, Jquery
         Mobile


© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Le app native sono più PERFORMANTI


         • Le native app non hanno la barriera del web rutime perchè
          usano l'hardware del device
         • Il web è diventato più veloce: Javascript engine più
         performanti, graphic hardware accelleration e Web Workers
         APIs




© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
V8, the JavaScript engine that ships with Chrome, was a major
      development in web performance when it launched, and since
                      then, it has only gotten faster:




© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Graphic rendering engines has also sped up the web, and now
      hardware acceleration is starting to happen. Have a look at the
         speed bump provided by hardware accelerated-canvas




© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Le app native sono SEMPLICI da sviluppare


         • Le native app usano linguaggi robusti, scalabili e facili da
         debuggare


         • Il web permette di usare I linguaggi open del web: HTML5,
         JavaScript, CSS3


         • Le Web App sono cross-platform (no-porting)


© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Le app native usano il LOOK&FEEL del device


         • Le native app usano controlli e componenti nativi del
         device a cui gli utenti sono abituati


         • Il web permette permette un approccio “one size fits all”


         • Le Web App possono essere personalizzate sulle
         piattaforme che riteniamo più importanti


© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Le app native si TROVANO facilmente


         • Le native app sono pubblicate sugli Store e trovate li dagli
         utenti


         • Il web è a disposizione di tutti accedendo dal browser e
         usando motori di ricerca

         • Manca un Web Store (a parte il Chrome Store) …. per ora



© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Le app native fanno GUADAGNARE


         • Gli store offrono un semplice sistema di pagamento per le
         native app


         • Il web permette di guadagnare con l'advertising e le
         sponsorship




© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Le app native si AGGIORNANO


         • Per aggiornare una native app bisogna ripubblicarla sullo
         Store


         • Le Web App possono essere aggiornate in maniera
         remota in quanto sono applicazioni web




© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
The vast majority of apps downloaded from the App Store are
        in use by less than 5% of users after one month has passed
                             since the download,




© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
The Financial Times Web App




© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
The FT web app, which is optimised for use on iPad and
  iPhone, is available via your Safari browser at app.ft.com rather
  than from an app store.

  The web app is our most complete app to date and we regularly
  add new features and sections to it.

  These are available instantly, without the need to download a
  new version. Recent additions include 'clippings' for iPad,
  allowing you to save articles for later reading, and enhanced
  graphics.

  The web app replaces our apps that were available in the App
  Store.

© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

Mobile HTML5 Web Apps - Codemotion 2012

  • 1.
    Marco Casario CTO – Comtaste http://casario.blogs.com © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  • 2.
  • 4.
    W ho am I
  • 5.
    © 2011 AdobeSystems Incorporated. All Rights Reserved. Adobe Confidential. WWW.COMTASTE.COM
  • 6.
    © 2011 AdobeSystems Incorporated. All Rights Reserved. Adobe Confidential. WWW.COMTASTE.COM
  • 7.
    © 2011 AdobeSystems Incorporated. All Rights Reserved. Adobe Confidential. WWW.COMTASTE.COM
  • 8.
    http://www.meetup.com/HTML5-Italy/ © 2011 AdobeSystems Incorporated. All Rights Reserved. Adobe Confidential.
  • 9.
    1 Mobile Explosion 2 Native apps vs. Web apps 3 PhoneGap, a mobile framework © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. WWW.COMTASTE.COM
  • 10.
    The explosion ofdevices introduces new challenges for every organization… © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  • 11.
    Il mobile hasuperato il web ! © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  • 12.
    Perchè cross-platform? © 2011Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  • 13.
    According to Cisco'sreport mobile data traffic will grow up to 1.3EB per month during this year. In 2016, Cisco predicts a total of 10.8EB of traffic every month. That's 11.324.620TB. © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  • 14.
    Native Apps vs. Web Apps © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. WWW.COMTASTE.COM
  • 15.
    Le app nativesono più POTENTI • In termini di UX le native app possono fare molto: massima integrazione con l'hardware del device • Il Web sta evolvendo velocemente. Vedi il recente annuncio del Battery Status API. W3C Working Draft 29 November 2011 • Nascita di framework come Phonegap, Titanium, Jquery Mobile © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  • 16.
    Le app nativesono più PERFORMANTI • Le native app non hanno la barriera del web rutime perchè usano l'hardware del device • Il web è diventato più veloce: Javascript engine più performanti, graphic hardware accelleration e Web Workers APIs © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  • 17.
    V8, the JavaScriptengine that ships with Chrome, was a major development in web performance when it launched, and since then, it has only gotten faster: © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  • 18.
    Graphic rendering engineshas also sped up the web, and now hardware acceleration is starting to happen. Have a look at the speed bump provided by hardware accelerated-canvas © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  • 19.
    Le app nativesono SEMPLICI da sviluppare • Le native app usano linguaggi robusti, scalabili e facili da debuggare • Il web permette di usare I linguaggi open del web: HTML5, JavaScript, CSS3 • Le Web App sono cross-platform (no-porting) © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  • 20.
    Le app nativeusano il LOOK&FEEL del device • Le native app usano controlli e componenti nativi del device a cui gli utenti sono abituati • Il web permette permette un approccio “one size fits all” • Le Web App possono essere personalizzate sulle piattaforme che riteniamo più importanti © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  • 21.
    Le app nativesi TROVANO facilmente • Le native app sono pubblicate sugli Store e trovate li dagli utenti • Il web è a disposizione di tutti accedendo dal browser e usando motori di ricerca • Manca un Web Store (a parte il Chrome Store) …. per ora © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  • 22.
    Le app nativefanno GUADAGNARE • Gli store offrono un semplice sistema di pagamento per le native app • Il web permette di guadagnare con l'advertising e le sponsorship © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  • 23.
    Le app nativesi AGGIORNANO • Per aggiornare una native app bisogna ripubblicarla sullo Store • Le Web App possono essere aggiornate in maniera remota in quanto sono applicazioni web © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  • 24.
    The vast majorityof apps downloaded from the App Store are in use by less than 5% of users after one month has passed since the download, © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  • 25.
    The Financial TimesWeb App © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  • 26.
    The FT webapp, which is optimised for use on iPad and iPhone, is available via your Safari browser at app.ft.com rather than from an app store. The web app is our most complete app to date and we regularly add new features and sections to it. These are available instantly, without the need to download a new version. Recent additions include 'clippings' for iPad, allowing you to save articles for later reading, and enhanced graphics. The web app replaces our apps that were available in the App Store. © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  • 27.
    © 2011 AdobeSystems Incorporated. All Rights Reserved. Adobe Confidential.