HTML5 impact on application programming

4,912 views

Published on

Published in: Technology
1 Comment
10 Likes
Statistics
Notes
No Downloads
Views
Total views
4,912
On SlideShare
0
From Embeds
0
Number of Embeds
1,463
Actions
Shares
0
Downloads
110
Comments
1
Likes
10
Embeds 0
No embeds

No notes for slide

HTML5 impact on application programming

  1. 1. Emerging Communication HTML5 & WebApps fredag den 10 september 2010
  2. 2. ericsson. com Ericsson Labs Challenge “Connected Things: Social, Fun & Sustainable”. Develop an innovative application using one or several APIs from labs.ericsson.com/apis The winner will receive a Sony Ericsson Android X10 Mini Pro device. Twitter: @ericssonlabs fredag den 10 september 2010
  3. 3. Emerging Communication HTML5 & WebApps fredag den 10 september 2010
  4. 4. Overview • What is HTML(5) Communication? • What is its impact? • Influence on native apps • Trends for future apps fredag den 10 september 2010
  5. 5. What is HTML5? • HTML5 - The Markup Language • HTML5 - The Web Technologies Umbrella Term fredag den 10 september 2010
  6. 6. HTML(5) Communication • Huge small topic • New communication technologies • New user expectations • New security concerns fredag den 10 september 2010
  7. 7. HTML(5) Communication • XmlHttpRequest • Cross-Origin XHR • EventSource • WebSockets fredag den 10 september 2010
  8. 8. XmlHttpRequest • The most basic tool available: HTTP request back home • Used creatively to great effect: • Comet/Long Polling • Proxies • Even streaming • Can only be used to the “Origin” host fredag den 10 september 2010
  9. 9. Cross Origin XHR • Simple extension to XHR • Allows connection to more than Origin • Main feature: eliminates proxy need fredag den 10 september 2010
  10. 10. EventSource • First new interface type • Formalisation of regular polling technique • Technique itself not rocket science in JavaScript • Ericsson Labs’ Event Source Enabler is ~100 lines of JS code fredag den 10 september 2010
  11. 11. EventSource • First new interface type • Formalisation of regular polling technique • Technique itself not rocket science in JavaScript • Ericsson Labs’ Event Source Enabler is ~100 lines of JS code fredag den 10 september 2010
  12. 12. WebSockets • Bidirectional communication between client & server • Connection-based • Uses delimited, sequential messages • UTF-8 based • More efficient than XHR fredag den 10 september 2010
  13. 13. Change? • On protocol level, nothing revolutionary • Some Web Service APIs will use WebSockets • Thus, native apps will have WebSocket Support • Real communication revolution from how users interact with web apps fredag den 10 september 2010
  14. 14. The Web Experience • If nothing changes, what’s the difference? • Technology alone is not the change agent • The web experience is • What is the web experience? fredag den 10 september 2010
  15. 15. What is HTML? • Language for presenting the user with information. • Document-centric model • Primary intention to distribute data for consumption • Naturally presents users with the latest information, regardless of access point fredag den 10 september 2010
  16. 16. Updates • (Web) Applications will always update themselves • No restarts, no prompts • Native apps going in that direction too (e.g. Chrome) fredag den 10 september 2010
  17. 17. Reach fredag den 10 september 2010
  18. 18. “The eventual goal [of Chrome] to create a ‘stateless’ browsing experience where the user can log into any Chrome instance and have instant access to all of their settings, bookmarks, history, and add-ons” Ryan Paul, Ars Technica fredag den 10 september 2010
  19. 19. Reach fredag den 10 september 2010
  20. 20. Reach fredag den 10 september 2010
  21. 21. Reach fredag den 10 september 2010
  22. 22. Reach fredag den 10 september 2010
  23. 23. Reach fredag den 10 september 2010
  24. 24. Reach fredag den 10 september 2010
  25. 25. Reach fredag den 10 september 2010
  26. 26. fredag den 10 september 2010
  27. 27. fredag den 10 september 2010
  28. 28. Adaptability fredag den 10 september 2010
  29. 29. Adaptability fredag den 10 september 2010
  30. 30. fredag den 10 september 2010
  31. 31. This morning, I was able to validate a concept I’ve been working on for a couple of weeks now: running one application — completely unchanged — on five different screens Christian Cantrell, Adobe fredag den 10 september 2010
  32. 32. This morning, I was able to validate a concept I’ve been working on for a couple of weeks now: running one application — completely unchanged — on five different screens Christian Cantrell, Adobe Multiscreen authoring is a challenge for our design customers. [...] There has been much discussion around whether or not HTML5 and CSS3 will make it easier for designers to reach new devices. We think it will Paul Gubbay, Adobe fredag den 10 september 2010
  33. 33. Adaptability fredag den 10 september 2010
  34. 34. fredag den 10 september 2010
  35. 35. Create Create fredag den 10 september 2010
  36. 36. Create Create fredag den 10 september 2010
  37. 37. Share Create Share fredag den 10 september 2010
  38. 38. Share Create Share fredag den 10 september 2010
  39. 39. Share Create Share fredag den 10 september 2010
  40. 40. Mash fredag den 10 september 2010
  41. 41. Interconnected fredag den 10 september 2010
  42. 42. fredag den 10 september 2010
  43. 43. iframe “mash-ups” [are] web pages that pull together their content from more than one site. You might build an application, for instance, in which part of the screen shows price-and- availability from a third-party vendor. Cameron Laird, Phaseit fredag den 10 september 2010
  44. 44. iframe “mash-ups” [are] web pages that pull together their content from more than one site. You might build an application, for instance, in which part of the screen shows price-and- availability from a third-party vendor. Cameron Laird, Phaseit I expect the iframe sandboxing feature will be a big boon to developers if it takes off. Ian Hickson, Google fredag den 10 september 2010
  45. 45. Interconnected • iframe sandbox allows secure inclusion of foregin data • Can now deal with sensitive user data • Implementation by Ericsson shipping in Chrome & Safari fredag den 10 september 2010
  46. 46. fredag den 10 september 2010
  47. 47. Create Create Shopping List Alice fredag den 10 september 2010
  48. 48. Create Create Shopping List Alice Apples fredag den 10 september 2010
  49. 49. Share Create Shopping List Alice Apples Bob fredag den 10 september 2010
  50. 50. Share Create Shopping List Alice Modify Shopping List Oranges Bob fredag den 10 september 2010
  51. 51. Access Create Shopping List Alice Modify Shopping List Oranges Bob To Buy Oranges fredag den 10 september 2010
  52. 52. Access Create Shopping List Alice • Adapted to the current screen • Familiar user Modify Shopping List interface Bob Oranges • Synchronised data • Because it is the same application To Buy Oranges fredag den 10 september 2010
  53. 53. Mash Expenses Planned Actual To Buy Oranges fredag den 10 september 2010
  54. 54. Mash Expenses Planned Actual To Buy Oranges fredag den 10 september 2010
  55. 55. Data • Increased requirement for open data formats • Applications integrate with user’s data stream, or are left behind • Devices open themselves up to integrate with that stream too fredag den 10 september 2010
  56. 56. Connectivity • Current “active” sync merely a stepping stone • Future apps will need to be aware of their “screen” counterparts • Need to keep track of, reach, talk to all instances, all (user’s) devices fredag den 10 september 2010
  57. 57. Synchronisation • Required to reach the functionality goals of Connectivity with the speed of Native • Implicit, automatic, background synchronization • Google Wave showed how synchronization can work, but... fredag den 10 september 2010
  58. 58. Demos • http://ergo.labs.ericsson.net/applications/canvas • http://ergo.labs.ericsson.net/applications/shared-map fredag den 10 september 2010
  59. 59. For more information • vladimir.katardjiev@ericsson.com fredag den 10 september 2010
  60. 60. fredag den 10 september 2010

×