SlideShare a Scribd company logo
Mobile JavaScript	
javascriptz right in yo hands, mawfocker
token “me” slide


 Web developer / Master Exploder at Nitobi Software
 SFU graduate
 Big fan of the open web
 Bigger Canucks fan
Mobile: How’s it doing?
Browsing ~3% of all browsing takes
 Today, by Device Category Trend         place on a mobile device;
November, 2009 to September, 2010
                           Apparently 6% in Asia.




Month                         Desktop           Mobile          Consol
November, 2009                98.65%                             0.04%
December, 2009                98.36%                             0.05%
January, 2010                 98.19%                             0.05%
Browsers everywhere!
WebKit FTW

The major browser platform moving forward
Apple started it
Android jumped on
Even RIM pulled their head out of their ass and made
the switch
But...
 Still have:
   Internet Explorer Mobile; now
   with extra non-compliance!
   Old BlackBerry Browser, it’s so
   bad it doesn’t have a name
so wtf do we do?




(other than drink beer)
codes that help
Peter Higgins’ has.js is rad
SunSpider is sweet
Sputnik is also neat
has.js
 Peter Higgins, Dojo project lead, put this out there as of
 JSConf.eu 2010.
 A JavaScript feature detection library, using JavaScript.
 http://github.com/phiggins42/has.js
SunSpider


A JavaScript benchmark.
Part of the WebKit project.
Sputnik


Google project, a JavaScript conformance test suite
against the ECMA-262 spec
Over 5000 tests
The numbers
Android (2.2)

 has.js: apparently a few css and DOM tests fail!
 function bind fails (?), and full <input> support is not
 there. No es5 or svg.
 SunSpider: 6121ms
 Sputnik: All tests ran, 226/5246 failed (4.3%)
iPhone (4)

 has.js: same css, dom and function bind issues as
 Android. Better <input> support too. es5 is lacking, but
 full SVG support (woot)?
 SunSpider: 10252 ms
 Sputnik: Crashed mobile safari... 3.7% tests fail
 (137/3746)
Shitty BlackBerry, slide 1
BlackBerry OS 5.0
Shitty BlackBerry, slide 2
has.js results
 array has no reduce or isarray methods, some regexp tests fail

 no audio support, no canvas

 there are lots of css bugs/lack of support: overflow, border-radius, transforms, text-
 overflow, opacity.

 super weak date support; no toisostring, now or tojson.

 no native JSON tools (just grab json2.js from json.org)

 no xhr upload events, any type of offline storage (OTHER THAN GEARS, YES!!!!)

 no svg, video or vml
Shitty BlackBerry, slide 3
SunSpider and Sputnik

 SunSpider: Didn’t finish, each test ran on average
 4000ms (compared to Android’s ~100ms).
 Sputnik: Can’t even get to the test runner!
BlackBerry 6 (WebKit)

has.js: better than both Android and iPhone. Full event
support (unlike Android/iPhone). Websockets and
worker support, that is fucking awesome. Full storage
options. SVG is super performant on it
SunSpider: 26131 ms
Sputnik: Crashed browser at 1%
Windows Phone 7
has.js: All array tests fail, no audio support,
getelementbyid ignores case, getelementsbytagname
returns comment nodes, so much more fail!
css bugs galore; see IE6.
no event.stopPropagation or preventDefault
BUT... VML!!!!
SunSpider: 145050 ms...
Sputnik: NOPE
Palm

has.js: pretty solid overall. createAttribute apparently
fails. canvas, audio, video works. sqlite and
localstorage options are there too.
SunSpider: 39193 ms
Sputnik: nope
Final words


 Know your enemy
 Pick your battles
BEER TIME NAO




Thanks!

More Related Content

PPT
Rogues At DNI Aug 06 Part 2
PDF
The sorry state of frontend code [a talk @ Softbinator]
PDF
Fixing web and JS gaps
PDF
The State of the Web - Helsinki meetup
PDF
Overboard.js - where are we going with with jsconfasia / devfestasia
PPTX
Save your social energy with windows live
PDF
The ES6 Conundrum - All Things Open 2015
PDF
Erase and Rewind - Open Web Camp 2015
Rogues At DNI Aug 06 Part 2
The sorry state of frontend code [a talk @ Softbinator]
Fixing web and JS gaps
The State of the Web - Helsinki meetup
Overboard.js - where are we going with with jsconfasia / devfestasia
Save your social energy with windows live
The ES6 Conundrum - All Things Open 2015
Erase and Rewind - Open Web Camp 2015

What's hot (10)

PPTX
Good rules for bad apps
PDF
20+ fantastic web development newsletters for developers & designers
KEY
Phonegap facebook plugin - Seoul & Tokyo
PPTX
Foundations of Security
PDF
All the small things… - Awwwards 2016
KEY
Everyday User Experience
KEY
Everyday User experience
PPTX
Mobile Usability & Search
PDF
Let’s learn how to use JavaScript responsibly and stay up-to-date.
PPT
Linux Users are People, Too!
Good rules for bad apps
20+ fantastic web development newsletters for developers & designers
Phonegap facebook plugin - Seoul & Tokyo
Foundations of Security
All the small things… - Awwwards 2016
Everyday User Experience
Everyday User experience
Mobile Usability & Search
Let’s learn how to use JavaScript responsibly and stay up-to-date.
Linux Users are People, Too!
Ad

Viewers also liked (8)

PDF
OSCON 2011 - HTML5 and Mobile: Getting From Good Enough To Great
PDF
PhoneGap Day: PhoneGap Build
PPTX
Mini training - Moving to xUnit.net
PPTX
Leapmotionとp5.js:DEMOと解説
PDF
Web Performance Optimization (WPO)
PDF
Mini-Training: JS Graphical Libraries
PDF
Processing.js vs. three.js
PPTX
.Net without spending a buck
OSCON 2011 - HTML5 and Mobile: Getting From Good Enough To Great
PhoneGap Day: PhoneGap Build
Mini training - Moving to xUnit.net
Leapmotionとp5.js:DEMOと解説
Web Performance Optimization (WPO)
Mini-Training: JS Graphical Libraries
Processing.js vs. three.js
.Net without spending a buck
Ad

Similar to Mobile JavaScript (20)

PDF
Front-End Engineering 101
KEY
Js On Mobile Devices
PPTX
Seminar Android - Pengenalan PhoneGap
KEY
Mobile html5 v2
KEY
Falsy Values - Warsaw 2011
KEY
Phonegap for Engineers
PDF
What Devops Need to Know about Mobile
KEY
Developing for Mobility
KEY
Philly ete-2011
PDF
Modern Browser Support
KEY
HTML5 and the Mobile Web
PDF
Mobile is slow - Over the Air 2013
PDF
Testing Mobile JavaScript (Fall 2010
PDF
Flourish2011
PDF
HTML5 Can't Do That
PDF
Real World Lessons in jQuery Mobile
PDF
Google presentation: The Open Web goes mobile
KEY
Smart phone development
PPTX
So you want to build a mobile app - HTML5 vs. Native @ the Boston Mobile Expe...
PDF
AngularJS on Mobile with the Ionic Framework
Front-End Engineering 101
Js On Mobile Devices
Seminar Android - Pengenalan PhoneGap
Mobile html5 v2
Falsy Values - Warsaw 2011
Phonegap for Engineers
What Devops Need to Know about Mobile
Developing for Mobility
Philly ete-2011
Modern Browser Support
HTML5 and the Mobile Web
Mobile is slow - Over the Air 2013
Testing Mobile JavaScript (Fall 2010
Flourish2011
HTML5 Can't Do That
Real World Lessons in jQuery Mobile
Google presentation: The Open Web goes mobile
Smart phone development
So you want to build a mobile app - HTML5 vs. Native @ the Boston Mobile Expe...
AngularJS on Mobile with the Ionic Framework

Recently uploaded (20)

PDF
Peak of Data & AI Encore- AI for Metadata and Smarter Workflows
PDF
Encapsulation theory and applications.pdf
PPTX
sap open course for s4hana steps from ECC to s4
PDF
Advanced methodologies resolving dimensionality complications for autism neur...
PPTX
MYSQL Presentation for SQL database connectivity
PDF
Approach and Philosophy of On baking technology
DOCX
The AUB Centre for AI in Media Proposal.docx
PPTX
Machine Learning_overview_presentation.pptx
PDF
7 ChatGPT Prompts to Help You Define Your Ideal Customer Profile.pdf
PDF
Spectral efficient network and resource selection model in 5G networks
PDF
Chapter 3 Spatial Domain Image Processing.pdf
PPTX
Spectroscopy.pptx food analysis technology
PDF
A comparative analysis of optical character recognition models for extracting...
PDF
Dropbox Q2 2025 Financial Results & Investor Presentation
PDF
Per capita expenditure prediction using model stacking based on satellite ima...
PDF
Review of recent advances in non-invasive hemoglobin estimation
PDF
MIND Revenue Release Quarter 2 2025 Press Release
PDF
Agricultural_Statistics_at_a_Glance_2022_0.pdf
PDF
TokAI - TikTok AI Agent : The First AI Application That Analyzes 10,000+ Vira...
PDF
Encapsulation_ Review paper, used for researhc scholars
Peak of Data & AI Encore- AI for Metadata and Smarter Workflows
Encapsulation theory and applications.pdf
sap open course for s4hana steps from ECC to s4
Advanced methodologies resolving dimensionality complications for autism neur...
MYSQL Presentation for SQL database connectivity
Approach and Philosophy of On baking technology
The AUB Centre for AI in Media Proposal.docx
Machine Learning_overview_presentation.pptx
7 ChatGPT Prompts to Help You Define Your Ideal Customer Profile.pdf
Spectral efficient network and resource selection model in 5G networks
Chapter 3 Spatial Domain Image Processing.pdf
Spectroscopy.pptx food analysis technology
A comparative analysis of optical character recognition models for extracting...
Dropbox Q2 2025 Financial Results & Investor Presentation
Per capita expenditure prediction using model stacking based on satellite ima...
Review of recent advances in non-invasive hemoglobin estimation
MIND Revenue Release Quarter 2 2025 Press Release
Agricultural_Statistics_at_a_Glance_2022_0.pdf
TokAI - TikTok AI Agent : The First AI Application That Analyzes 10,000+ Vira...
Encapsulation_ Review paper, used for researhc scholars

Mobile JavaScript

  • 1. Mobile JavaScript javascriptz right in yo hands, mawfocker
  • 2. token “me” slide Web developer / Master Exploder at Nitobi Software SFU graduate Big fan of the open web Bigger Canucks fan
  • 3. Mobile: How’s it doing? Browsing ~3% of all browsing takes Today, by Device Category Trend place on a mobile device; November, 2009 to September, 2010 Apparently 6% in Asia. Month Desktop Mobile Consol November, 2009 98.65% 0.04% December, 2009 98.36% 0.05% January, 2010 98.19% 0.05%
  • 5. WebKit FTW The major browser platform moving forward Apple started it Android jumped on Even RIM pulled their head out of their ass and made the switch
  • 6. But... Still have: Internet Explorer Mobile; now with extra non-compliance! Old BlackBerry Browser, it’s so bad it doesn’t have a name
  • 7. so wtf do we do? (other than drink beer)
  • 8. codes that help Peter Higgins’ has.js is rad SunSpider is sweet Sputnik is also neat
  • 9. has.js Peter Higgins, Dojo project lead, put this out there as of JSConf.eu 2010. A JavaScript feature detection library, using JavaScript. http://github.com/phiggins42/has.js
  • 10. SunSpider A JavaScript benchmark. Part of the WebKit project.
  • 11. Sputnik Google project, a JavaScript conformance test suite against the ECMA-262 spec Over 5000 tests
  • 13. Android (2.2) has.js: apparently a few css and DOM tests fail! function bind fails (?), and full <input> support is not there. No es5 or svg. SunSpider: 6121ms Sputnik: All tests ran, 226/5246 failed (4.3%)
  • 14. iPhone (4) has.js: same css, dom and function bind issues as Android. Better <input> support too. es5 is lacking, but full SVG support (woot)? SunSpider: 10252 ms Sputnik: Crashed mobile safari... 3.7% tests fail (137/3746)
  • 15. Shitty BlackBerry, slide 1 BlackBerry OS 5.0
  • 16. Shitty BlackBerry, slide 2 has.js results array has no reduce or isarray methods, some regexp tests fail no audio support, no canvas there are lots of css bugs/lack of support: overflow, border-radius, transforms, text- overflow, opacity. super weak date support; no toisostring, now or tojson. no native JSON tools (just grab json2.js from json.org) no xhr upload events, any type of offline storage (OTHER THAN GEARS, YES!!!!) no svg, video or vml
  • 17. Shitty BlackBerry, slide 3 SunSpider and Sputnik SunSpider: Didn’t finish, each test ran on average 4000ms (compared to Android’s ~100ms). Sputnik: Can’t even get to the test runner!
  • 18. BlackBerry 6 (WebKit) has.js: better than both Android and iPhone. Full event support (unlike Android/iPhone). Websockets and worker support, that is fucking awesome. Full storage options. SVG is super performant on it SunSpider: 26131 ms Sputnik: Crashed browser at 1%
  • 19. Windows Phone 7 has.js: All array tests fail, no audio support, getelementbyid ignores case, getelementsbytagname returns comment nodes, so much more fail! css bugs galore; see IE6. no event.stopPropagation or preventDefault BUT... VML!!!! SunSpider: 145050 ms... Sputnik: NOPE
  • 20. Palm has.js: pretty solid overall. createAttribute apparently fails. canvas, audio, video works. sqlite and localstorage options are there too. SunSpider: 39193 ms Sputnik: nope
  • 21. Final words Know your enemy Pick your battles

Editor's Notes

  • #3: other stuff: - one of many contributors/maintainers of PhoneGap, XUI, lawnchair
  • #4: other interesting tidbits: - financial firm Morgan Stanley predicts mobile browsing will outstrip desktop by 2015
  • #5: web as a platform; fuck native if we could harness the power of browsers we could get out to so many people
  • #6: -closest thing we have to a unified platform on the web
  • #7: - initially, WP7 had IE 6/7 hybrid. latest version has 7/8 hybrid. sources say the browser is separate from the rest of the platform and can be upgraded much easier than the OS. Also MSFT has hinted that it will be moving WP7 to IE9.
  • #10: - checks for proper behaviour in your basic types, functions (binding et al), common browser bugs.
  • #11: tons of benchmark tests, run a bunch of times for each test to come up with a 95% confidence interval
  • #12: hard to read tho. you need to know the ecma spec to make any real sense of it. but a good guide for general ecmascript conformance.
  • #16: so much fail I need many slides to show this off
  • #17: re: css. it DOES have position: fixed though!
  • #18: no surprises here
  • #22: know your enemy: look at your analytics. if youre building a mobile site, who visits your &amp;#x2018;desktop&amp;#x2019; site? pick your battles: some of these environments really suck. building a web app on one platform might take four or five times more time than building it for another one.