Your SlideShare is downloading. ×
0
May, 29th, 2012   San Francisco, CA                          Max Firtman @firt                       BREAKING HTML5        ...
who am I?                                  @firt      mobile+web developer      mobilexweb.comTuesday, May 29, 12
where?Tuesday, May 29, 12
where?        buenos aires ~ argentinaTuesday, May 29, 12
where?        buenos aires ~ argentina                      patagonia                      soccer                      mea...
speakerTuesday, May 29, 12
books                      Image from my houseTuesday, May 29, 12
Tuesday, May 29, 12
Tuesday, May 29, 12
the answer is noTuesday, May 29, 12
Tuesday, May 29, 12
.comTuesday, May 29, 12
Tuesday, May 29, 12
About this                      workshopTuesday, May 29, 12
About...         Introduction         Live examples & labs         Live coding, how?Tuesday, May 29, 12
Logistics         9am: start         ~11.00am: break 30 min         ~11.30am: second part         ~12.15pm: end, Q&A      ...
Logistics        Please:        - Mobile phones in vibration mode (ironic, I know)        - Participate and ask!Tuesday, M...
Let’s startTuesday, May 29, 12
mobile...Tuesday, May 29, 12
mobileTuesday, May 29, 12
mobile                      ‣   absolutely personalTuesday, May 29, 12
mobile                      ‣ absolutely personal                      ‣ +5 billionsTuesday, May 29, 12
mobile                      ‣ absolutely personal                      ‣ +5 billions                      ‣ make us focusT...
mobile                      ‣ absolutely personal                      ‣ +5 billions                      ‣ make us focus ...
mobile                      ‣ absolutely personal                      ‣ +5 billions                      ‣ make us focus ...
mobile                      ‣ absolutely personal                      ‣ +5 billions                      ‣ make us focus ...
Tuesday, May 29, 12
mobile web appearsTuesday, May 29, 12
mobile is a   minefield                      Photo by World of Good (Flickr)        Malvinas / Falklands IslandsTuesday, Ma...
lots of questions     Photo by wayneandwax (Flickr)Tuesday, May 29, 12
we need to learn                      lots of questionsTuesday, May 29, 12
lots of platformsTuesday, May 29, 12
problems for us                      1. It’s different                      2. native vs. web                      3. stan...
it’s different                         Slower networksTuesday, May 29, 12
it’s different                         Different browsingTuesday, May 29, 12
it’s different                         Different behaviorTuesday, May 29, 12
it’s different                        Proxy-based browsers                           aka Where is my JavaScript?Tuesday, Ma...
mobile browsersTuesday, May 29, 12
mobile browsers                      ‣   too manyTuesday, May 29, 12
mobile browsers                      ‣   too many                      ‣   (some) too limitedTuesday, May 29, 12
mobile browsers                      ‣   too many                      ‣   (some) too limited                      ‣   (so...
mobile browsers                      ‣   too many                      ‣   (some) too limited                      ‣   (so...
mobile browsers                      ‣   too many                      ‣   (some) too limited                      ‣   (so...
mobile browsers                      ‣   too many                      ‣   (some) too limited                      ‣   (so...
statistics                         gs.statcounter.com - Apr 12Tuesday, May 29, 12
some are knownTuesday, May 29, 12
some are known                      ‣ Safari (on iOS)                      ‣ Opera Mobile (on Android & Symbian)          ...
some are unknownTuesday, May 29, 12
some are unknown                      ‣ Nokia Browser (on Symbian, S40 & Meego 1.2)                      ‣ BlackBerry Brow...
and with different                         versions...Tuesday, May 29, 12
with different enginesTuesday, May 29, 12
with different engines                      ‣   Rendering engines                          ‣ WebKit                        ...
and there’s more!Tuesday, May 29, 12
web viewsTuesday, May 29, 12
web viewsTuesday, May 29, 12
web views                      ‣   on iOS, different execution engineTuesday, May 29, 12
web views                      ‣ on iOS, different execution engine                      ‣ differences on HTML5 APIsTuesday,...
apps with          browsers          insideTuesday, May 29, 12
pseudo-browsersTuesday, May 29, 12
pseudobrowsersTuesday, May 29, 12
pseudobrowsers                      ‣   mostly on iOS and AndroidTuesday, May 29, 12
pseudobrowsers                      ‣ mostly on iOS and Android                      ‣ use the web viewTuesday, May 29, 12
and we can also                   create native apps                  -such as phonegap-Tuesday, May 29, 12
problems for us                      1. It’s different                      2. native vs. web                      3. stan...
native                        vs                       webTuesday, May 29, 12
native code                           vs                       javascriptTuesday, May 29, 12
browser                             vs                      installed apps                         & storesTuesday, May 29...
what is native?Tuesday, May 29, 12
what is a webapp?Tuesday, May 29, 12
no taxonomy                            p p                                   p p                         b a          iv e...
problems for us                      1. It’s different                      2. native vs. web                      3. stan...
standars?Tuesday, May 29, 12
Photo by Ben Millett (Flickr)Tuesday, May 29, 12
Tuesday, May 29, 12
Are you         sure?     Photo by Ricky David (Flickr)Tuesday, May 29, 12
What is   ?Tuesday, May 29, 12
html5Tuesday, May 29, 12
html5                      ‣   w3c standards (all in draft)Tuesday, May 29, 12
html5                      ‣ w3c standards (all in draft)                      ‣ some are other w3c standardsTuesday, May ...
html5                      ‣ w3c standards (all in draft)                      ‣ some are other w3c standards             ...
html5                      ‣ w3c standards (all in draft)                      ‣ some are other w3c standards             ...
html5                      ‣ w3c standards (all in draft)                      ‣ some are other w3c standards             ...
html version 5?Tuesday, May 29, 12
why mobile html5?Tuesday, May 29, 12
typeof html5 != booleanTuesday, May 29, 12
some features safeTuesday, May 29, 12
some features only on              few platformsTuesday, May 29, 12
some features                      experimentalTuesday, May 29, 12
some features with                          prefixesTuesday, May 29, 12
and what about                      capabilities today?Tuesday, May 29, 12
Tuesday, May 29, 12
problems for us                      1. It’s different                      2. native vs. web                      3. stan...
why?                        fragmentation                      info, docs & toolsTuesday, May 29, 12
second class developersTuesday, May 29, 12
second class developers         ‣  vague, non-existent or outdated           documentationTuesday, May 29, 12
second class developers         ‣ vague, non-existent or outdated          documentation         ‣ new features discovered...
second class developers         ‣ vague, non-existent or outdated          documentation         ‣ new features discovered...
second class developers         ‣ vague, non-existent or outdated          documentation         ‣ new features discovered...
fragmentationTuesday, May 29, 12
fragmentationTuesday, May 29, 12
fragmentation                      ‣   screen sizesTuesday, May 29, 12
fragmentation                      ‣   screen sizes                          ‣   2.5”, 3”, 3.5”, 4”, 4.5”, 5.5”, 7”, 10”Tu...
fragmentation                      ‣   screen sizes                          ‣   2.5”, 3”, 3.5”, 4”, 4.5”, 5.5”, 7”, 10”  ...
fragmentation                      ‣   screen sizes                          ‣   2.5”, 3”, 3.5”, 4”, 4.5”, 5.5”, 7”, 10”  ...
fragmentation                      ‣   screen sizes                          ‣   2.5”, 3”, 3.5”, 4”, 4.5”, 5.5”, 7”, 10”  ...
fragmentation                      ‣   screen sizes                          ‣   2.5”, 3”, 3.5”, 4”, 4.5”, 5.5”, 7”, 10”  ...
fragmentation                      ‣   screen sizes                          ‣   2.5”, 3”, 3.5”, 4”, 4.5”, 5.5”, 7”, 10”  ...
fragmentation                      ‣   screen sizes                          ‣   2.5”, 3”, 3.5”, 4”, 4.5”, 5.5”, 7”, 10”  ...
fragmentation                      ‣   screen sizes                          ‣   2.5”, 3”, 3.5”, 4”, 4.5”, 5.5”, 7”, 10”  ...
fragmentation                                                                        QQVGA                                ...
Tuesday, May 29, 12
Tuesday, May 29, 12
mobile javascript                          testingTuesday, May 29, 12
emulators                      mobilexweb.com/emulatorsTuesday, May 29, 12
friends                lots of them                and with different devicesTuesday, May 29, 12
virtual labs            real devices on real networks            www.perfectomobile.com   www.deviceanywhere.comTuesday, M...
mobile javascript                        debuggingTuesday, May 29, 12
debugging tools            Remote Web Inspector            • BlackBerry Smartphones 7            • BlackBerry PlayBook    ...
debugging tools        Adobe Shadow           adobe.com/go/shadowTuesday, May 29, 12
debugging tools                       iwebinspector.comTuesday, May 29, 12
problems for us                      1. It’s different                      2. native vs. web                      3. stan...
Tuesday, May 29, 12
Tuesday, May 29, 12
Tuesday, May 29, 12
Tuesday, May 29, 12
mobile                    web                  is slowPicture from Simon Howden freedigitalphotos.net!Tuesday, May 29, 12
Tuesday, May 29, 12
battery consumptionWW 2012 – Session: Mobile Web Performance                                                              ...
battery consumption                      Amazon consumes 17% energy                            in a non used JS           ...
DiscriminationTuesday, May 29, 12
Tuesday, May 29, 12
Tuesday, May 29, 12
problems for us                      1. It’s different                      2. native vs. web                      3. stan...
some last advicesTuesday, May 29, 12
Tuesday, May 29, 12
performance,                      performanceTuesday, May 29, 12
good practicesTuesday, May 29, 12
don’t be fanatic  photo by Kurt Christensen           (flickr)Tuesday, May 29, 12
be multiplatformTuesday, May 29, 12
be                      futurefriend.lyTuesday, May 29, 12
you can reach a good                                 thank you!                           experience                     fi...
Upcoming SlideShare
Loading in...5
×

Breaking HTML5 limits with Mobile JavaScript

3,760

Published on

My workshop on mobile HTML5 at FluentConf in San Francisco, May 29th, 2012

Published in: Technology, Business
3 Comments
12 Likes
Statistics
Notes
No Downloads
Views
Total Views
3,760
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
92
Comments
3
Likes
12
Embeds 0
No embeds

No notes for slide

Transcript of "Breaking HTML5 limits with Mobile JavaScript"

  1. 1. May, 29th, 2012 San Francisco, CA Max Firtman @firt BREAKING HTML5 LIMITS ON MOBILE JAVASCRIPTTuesday, May 29, 12
  2. 2. who am I? @firt mobile+web developer mobilexweb.comTuesday, May 29, 12
  3. 3. where?Tuesday, May 29, 12
  4. 4. where? buenos aires ~ argentinaTuesday, May 29, 12
  5. 5. where? buenos aires ~ argentina patagonia soccer meat & wine tangoTuesday, May 29, 12
  6. 6. speakerTuesday, May 29, 12
  7. 7. books Image from my houseTuesday, May 29, 12
  8. 8. Tuesday, May 29, 12
  9. 9. Tuesday, May 29, 12
  10. 10. the answer is noTuesday, May 29, 12
  11. 11. Tuesday, May 29, 12
  12. 12. .comTuesday, May 29, 12
  13. 13. Tuesday, May 29, 12
  14. 14. About this workshopTuesday, May 29, 12
  15. 15. About... Introduction Live examples & labs Live coding, how?Tuesday, May 29, 12
  16. 16. Logistics 9am: start ~11.00am: break 30 min ~11.30am: second part ~12.15pm: end, Q&A 1pm: lunch :)Tuesday, May 29, 12
  17. 17. Logistics Please: - Mobile phones in vibration mode (ironic, I know) - Participate and ask!Tuesday, May 29, 12
  18. 18. Let’s startTuesday, May 29, 12
  19. 19. mobile...Tuesday, May 29, 12
  20. 20. mobileTuesday, May 29, 12
  21. 21. mobile ‣ absolutely personalTuesday, May 29, 12
  22. 22. mobile ‣ absolutely personal ‣ +5 billionsTuesday, May 29, 12
  23. 23. mobile ‣ absolutely personal ‣ +5 billions ‣ make us focusTuesday, May 29, 12
  24. 24. mobile ‣ absolutely personal ‣ +5 billions ‣ make us focus ‣ read our context...Tuesday, May 29, 12
  25. 25. mobile ‣ absolutely personal ‣ +5 billions ‣ make us focus ‣ read our context... ‣ ... always...Tuesday, May 29, 12
  26. 26. mobile ‣ absolutely personal ‣ +5 billions ‣ make us focus ‣ read our context... ‣ ... always... ‣ ... and everywhere.Tuesday, May 29, 12
  27. 27. Tuesday, May 29, 12
  28. 28. mobile web appearsTuesday, May 29, 12
  29. 29. mobile is a minefield Photo by World of Good (Flickr) Malvinas / Falklands IslandsTuesday, May 29, 12
  30. 30. lots of questions Photo by wayneandwax (Flickr)Tuesday, May 29, 12
  31. 31. we need to learn lots of questionsTuesday, May 29, 12
  32. 32. lots of platformsTuesday, May 29, 12
  33. 33. problems for us 1. It’s different 2. native vs. web 3. standards 4. vendors hate web developers 5. users hate web developersTuesday, May 29, 12
  34. 34. it’s different Slower networksTuesday, May 29, 12
  35. 35. it’s different Different browsingTuesday, May 29, 12
  36. 36. it’s different Different behaviorTuesday, May 29, 12
  37. 37. it’s different Proxy-based browsers aka Where is my JavaScript?Tuesday, May 29, 12
  38. 38. mobile browsersTuesday, May 29, 12
  39. 39. mobile browsers ‣ too manyTuesday, May 29, 12
  40. 40. mobile browsers ‣ too many ‣ (some) too limitedTuesday, May 29, 12
  41. 41. mobile browsers ‣ too many ‣ (some) too limited ‣ (some) too innovativeTuesday, May 29, 12
  42. 42. mobile browsers ‣ too many ‣ (some) too limited ‣ (some) too innovative ‣ (most) without documentationTuesday, May 29, 12
  43. 43. mobile browsers ‣ too many ‣ (some) too limited ‣ (some) too innovative ‣ (most) without documentation ‣ (most) without a nameTuesday, May 29, 12
  44. 44. mobile browsers ‣ too many ‣ (some) too limited ‣ (some) too innovative ‣ (most) without documentation ‣ (most) without a name ‣ (most) without debugging toolsTuesday, May 29, 12
  45. 45. statistics gs.statcounter.com - Apr 12Tuesday, May 29, 12
  46. 46. some are knownTuesday, May 29, 12
  47. 47. some are known ‣ Safari (on iOS) ‣ Opera Mobile (on Android & Symbian) ‣ Firefox (on Android) ‣ Chrome (on Android) ‣ Internet Explorer (on Windows Phone)Tuesday, May 29, 12
  48. 48. some are unknownTuesday, May 29, 12
  49. 49. some are unknown ‣ Nokia Browser (on Symbian, S40 & Meego 1.2) ‣ BlackBerry Browser ‣ Android Browser ‣ webOS Browser ‣ UCWeb ‣ Amazon Silk ‣ Bada Browser ‣ Opera Mini ‣ NetFront ‣ Phantom ‣ ...Tuesday, May 29, 12
  50. 50. and with different versions...Tuesday, May 29, 12
  51. 51. with different enginesTuesday, May 29, 12
  52. 52. with different engines ‣ Rendering engines ‣ WebKit ‣ Gecko ‣ Presto ‣ Trident ‣ Modern execution engines ‣ V8 ‣ JagerMonkey ‣ SquirrelFish (aka Nitro) ‣ Carakan ‣ ChakraTuesday, May 29, 12
  53. 53. and there’s more!Tuesday, May 29, 12
  54. 54. web viewsTuesday, May 29, 12
  55. 55. web viewsTuesday, May 29, 12
  56. 56. web views ‣ on iOS, different execution engineTuesday, May 29, 12
  57. 57. web views ‣ on iOS, different execution engine ‣ differences on HTML5 APIsTuesday, May 29, 12
  58. 58. apps with browsers insideTuesday, May 29, 12
  59. 59. pseudo-browsersTuesday, May 29, 12
  60. 60. pseudobrowsersTuesday, May 29, 12
  61. 61. pseudobrowsers ‣ mostly on iOS and AndroidTuesday, May 29, 12
  62. 62. pseudobrowsers ‣ mostly on iOS and Android ‣ use the web viewTuesday, May 29, 12
  63. 63. and we can also create native apps -such as phonegap-Tuesday, May 29, 12
  64. 64. problems for us 1. It’s different 2. native vs. web 3. standards 4. vendors hate web developers 5. users hate web developersTuesday, May 29, 12
  65. 65. native vs webTuesday, May 29, 12
  66. 66. native code vs javascriptTuesday, May 29, 12
  67. 67. browser vs installed apps & storesTuesday, May 29, 12
  68. 68. what is native?Tuesday, May 29, 12
  69. 69. what is a webapp?Tuesday, May 29, 12
  70. 70. no taxonomy p p p p b a iv e r id 5 a e a t y b l w n h h tmTuesday, May 29, 12
  71. 71. problems for us 1. It’s different 2. native vs. web 3. standards 4. vendors hate web developers 5. users hate web developersTuesday, May 29, 12
  72. 72. standars?Tuesday, May 29, 12
  73. 73. Photo by Ben Millett (Flickr)Tuesday, May 29, 12
  74. 74. Tuesday, May 29, 12
  75. 75. Are you sure? Photo by Ricky David (Flickr)Tuesday, May 29, 12
  76. 76. What is ?Tuesday, May 29, 12
  77. 77. html5Tuesday, May 29, 12
  78. 78. html5 ‣ w3c standards (all in draft)Tuesday, May 29, 12
  79. 79. html5 ‣ w3c standards (all in draft) ‣ some are other w3c standardsTuesday, May 29, 12
  80. 80. html5 ‣ w3c standards (all in draft) ‣ some are other w3c standards ‣ de-facto standardsTuesday, May 29, 12
  81. 81. html5 ‣ w3c standards (all in draft) ‣ some are other w3c standards ‣ de-facto standards ‣ w3c ex-standardsTuesday, May 29, 12
  82. 82. html5 ‣ w3c standards (all in draft) ‣ some are other w3c standards ‣ de-facto standards ‣ w3c ex-standards ‣ everything “new” on the webTuesday, May 29, 12
  83. 83. html version 5?Tuesday, May 29, 12
  84. 84. why mobile html5?Tuesday, May 29, 12
  85. 85. typeof html5 != booleanTuesday, May 29, 12
  86. 86. some features safeTuesday, May 29, 12
  87. 87. some features only on few platformsTuesday, May 29, 12
  88. 88. some features experimentalTuesday, May 29, 12
  89. 89. some features with prefixesTuesday, May 29, 12
  90. 90. and what about capabilities today?Tuesday, May 29, 12
  91. 91. Tuesday, May 29, 12
  92. 92. problems for us 1. It’s different 2. native vs. web 3. standards 4. vendors hate web developers 5. users hate web developersTuesday, May 29, 12
  93. 93. why? fragmentation info, docs & toolsTuesday, May 29, 12
  94. 94. second class developersTuesday, May 29, 12
  95. 95. second class developers ‣ vague, non-existent or outdated documentationTuesday, May 29, 12
  96. 96. second class developers ‣ vague, non-existent or outdated documentation ‣ new features discovered by third-partiesTuesday, May 29, 12
  97. 97. second class developers ‣ vague, non-existent or outdated documentation ‣ new features discovered by third-parties ‣ lack of samplesTuesday, May 29, 12
  98. 98. second class developers ‣ vague, non-existent or outdated documentation ‣ new features discovered by third-parties ‣ lack of samples ‣ no developer toolsTuesday, May 29, 12
  99. 99. fragmentationTuesday, May 29, 12
  100. 100. fragmentationTuesday, May 29, 12
  101. 101. fragmentation ‣ screen sizesTuesday, May 29, 12
  102. 102. fragmentation ‣ screen sizes ‣ 2.5”, 3”, 3.5”, 4”, 4.5”, 5.5”, 7”, 10”Tuesday, May 29, 12
  103. 103. fragmentation ‣ screen sizes ‣ 2.5”, 3”, 3.5”, 4”, 4.5”, 5.5”, 7”, 10” ‣ screen aspect ratioTuesday, May 29, 12
  104. 104. fragmentation ‣ screen sizes ‣ 2.5”, 3”, 3.5”, 4”, 4.5”, 5.5”, 7”, 10” ‣ screen aspect ratio ‣ 4:3, 16:9 (wide-screen), 5:3 (eur wide)Tuesday, May 29, 12
  105. 105. fragmentation ‣ screen sizes ‣ 2.5”, 3”, 3.5”, 4”, 4.5”, 5.5”, 7”, 10” ‣ screen aspect ratio ‣ 4:3, 16:9 (wide-screen), 5:3 (eur wide) ‣ screen pixel densityTuesday, May 29, 12
  106. 106. fragmentation ‣ screen sizes ‣ 2.5”, 3”, 3.5”, 4”, 4.5”, 5.5”, 7”, 10” ‣ screen aspect ratio ‣ 4:3, 16:9 (wide-screen), 5:3 (eur wide) ‣ screen pixel density ‣ Low density: 100 - 130 dpiTuesday, May 29, 12
  107. 107. fragmentation ‣ screen sizes ‣ 2.5”, 3”, 3.5”, 4”, 4.5”, 5.5”, 7”, 10” ‣ screen aspect ratio ‣ 4:3, 16:9 (wide-screen), 5:3 (eur wide) ‣ screen pixel density ‣ Low density: 100 - 130 dpi ‣ Medium density: 130 - 180 dpiTuesday, May 29, 12
  108. 108. fragmentation ‣ screen sizes ‣ 2.5”, 3”, 3.5”, 4”, 4.5”, 5.5”, 7”, 10” ‣ screen aspect ratio ‣ 4:3, 16:9 (wide-screen), 5:3 (eur wide) ‣ screen pixel density ‣ Low density: 100 - 130 dpi ‣ Medium density: 130 - 180 dpi ‣ High density: 180 - 270 dpiTuesday, May 29, 12
  109. 109. fragmentation ‣ screen sizes ‣ 2.5”, 3”, 3.5”, 4”, 4.5”, 5.5”, 7”, 10” ‣ screen aspect ratio ‣ 4:3, 16:9 (wide-screen), 5:3 (eur wide) ‣ screen pixel density ‣ Low density: 100 - 130 dpi ‣ Medium density: 130 - 180 dpi ‣ High density: 180 - 270 dpi ‣ Ultra high density: 270 - 350 dpiTuesday, May 29, 12
  110. 110. fragmentation QQVGA QVGA WQVGA FWQVGA ‣ screen sizes LQVGA HVGA ‣ 2.5”, 3”, 3.5”, 4”, 4.5”, 5.5”, 7”, 10” nHD ‣ screen aspect ratio WVGA FWVGA ‣ 4:3, 16:9 (wide-screen), 5:3 (eur wide) VGA ‣ screen pixel density DVGA QHD ‣ Low density: 100 - 130 dpi WSVGA ‣ Medium density: 130 - 180 dpi HD XGA ‣ High density: 180 - 270 dpi WXGA ‣ Ultra high density: 270 - 350 dpi QXGATuesday, May 29, 12
  111. 111. Tuesday, May 29, 12
  112. 112. Tuesday, May 29, 12
  113. 113. mobile javascript testingTuesday, May 29, 12
  114. 114. emulators mobilexweb.com/emulatorsTuesday, May 29, 12
  115. 115. friends lots of them and with different devicesTuesday, May 29, 12
  116. 116. virtual labs real devices on real networks www.perfectomobile.com www.deviceanywhere.comTuesday, May 29, 12
  117. 117. mobile javascript debuggingTuesday, May 29, 12
  118. 118. debugging tools Remote Web Inspector • BlackBerry Smartphones 7 • BlackBerry PlayBook • Google Chrome for Android 4 • Opera MobileTuesday, May 29, 12
  119. 119. debugging tools Adobe Shadow adobe.com/go/shadowTuesday, May 29, 12
  120. 120. debugging tools iwebinspector.comTuesday, May 29, 12
  121. 121. problems for us 1. It’s different 2. native vs. web 3. standards 4. vendors hate web developers 5. users hate web developersTuesday, May 29, 12
  122. 122. Tuesday, May 29, 12
  123. 123. Tuesday, May 29, 12
  124. 124. Tuesday, May 29, 12
  125. 125. Tuesday, May 29, 12
  126. 126. mobile web is slowPicture from Simon Howden freedigitalphotos.net!Tuesday, May 29, 12
  127. 127. Tuesday, May 29, 12
  128. 128. battery consumptionWW 2012 – Session: Mobile Web Performance April 16–20, 2012, Lyon, Fra 50 45 40 Energy (Joules) 35 30 25 20 15 10 5 0 live.com microsoft weather picasa baidu facebook imdb youtube go.com wall st. journal blogger 3G setup nytimes tumblr wikipedia apple ebay amazon gmail yahoo cnn bbc engadget natgeo wordpress aol Figure 6: Energy consumption of top websites Web site Comment % Battery Traffic (bytes) life Upload Download The resulting numbers are shown in Figure 6. Note that the e m.gmail.com inbox 0.41 9050 12048 bars are so small that they are barely visible. m.picasa.com m.aol.com Who Killed My Battery ~ mobilexweb.com/go/battery user albums portal home 0.43 0.59 8223 11927 15475 37085 The left most column in Figure 6 shows the energy neede set up a 3G connection and download a few bytes without any m.amazon.com product page 0.48 9523 26838 ditional processing. Since all navigation requests must setup a mobile.nytimes.com US home page 0.53 15386 66336 touch.facebook.com facebook wall 0.65 30214 81040 connection we treat this measurement as a baseline where th mw.weather.com Stanford weather 0.62 38253 134531 teresting differences between web sites are above this line. apple.com Tuesday, May 29, 12 home page 1.41 86888 716835 Figure 6 is generated from the mobile versions of the
  129. 129. battery consumption Amazon consumes 17% energy in a non used JS jQuery.js ~ 4 joules (0,02%) ~5000 jQuery parsings per charge Who Killed My Battery ~ mobilexweb.com/go/batteryTuesday, May 29, 12
  130. 130. DiscriminationTuesday, May 29, 12
  131. 131. Tuesday, May 29, 12
  132. 132. Tuesday, May 29, 12
  133. 133. problems for us 1. It’s different 2. native vs. web 3. standards 4. vendors hate web developers 5. users hate web developersTuesday, May 29, 12
  134. 134. some last advicesTuesday, May 29, 12
  135. 135. Tuesday, May 29, 12
  136. 136. performance, performanceTuesday, May 29, 12
  137. 137. good practicesTuesday, May 29, 12
  138. 138. don’t be fanatic photo by Kurt Christensen (flickr)Tuesday, May 29, 12
  139. 139. be multiplatformTuesday, May 29, 12
  140. 140. be futurefriend.lyTuesday, May 29, 12
  141. 141. you can reach a good thank you! experience firt.mobi Tomorrow firtman@gmail.com 10.30am twitter: @firt www.mobilexweb.com Book signing Pictures)from)freedigitalphotos.net)Tuesday, May 29, 12
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×