Mobile Debugging

C8b387c489181844b3ffc704fadc0f14?s=47 Remy Sharp
September 21, 2012

Mobile Debugging

Mobile debugging is a bitch. Let's talk about that, and then fix it.

C8b387c489181844b3ffc704fadc0f14?s=128

Remy Sharp

September 21, 2012
Tweet

Transcript

  1. Mobile Debugging Remy Sharp / @rem

  2. Debugging is a... http://www.flickr.com/photos/grill/2655848033

  3. ...and I ❤ debugging http://www.flickr.com/photos/grill/2655848033

  4. Back in early 2000

  5. Our first mobile webapp circa 1999 Amazingly actually still live!!!

  6. XML parsing :( (but strict is strict)

  7. None
  8. http://www.flickr.com/photos/60119893@N00/2883012011/

  9. Art of debugging methodically Replicate so that you can Isolate

    and ultimately Eliminate
  10. Principles 1. Know thy enemy 2. Close the gap 3.

    Expect the unexpected
  11. 1. Know thy enemy

  12. ஌ݾ஌൴ɼඦፌෆຆɻ “If you know both yourself and your enemy, you

    can win a hundred battles without jeopardy.” http://www.flickr.com/photos/katieharbath/4856255673
  13. Simulators mobilexweb.com/emulators

  14. Get real devices http://www.flickr.com/photos/sidesh0w/6675107387 http://bradfrostweb.com/blog/mobile/test-on-real-mobile-devices-without-breaking-the-bank/

  15. Get FREE devices http://www.flickr.com/photos/sidesh0w/6675107387 http://bradfrostweb.com/blog/mobile/test-on-real-mobile-devices-without-breaking-the-bank/

  16. Share devices http://www.flickr.com/photos/sidesh0w/6675107387

  17. http://jsconsole.com?this

  18. Understand performance

  19. WTF? Wikipedia has more JavaScript than Gmail? http://remysharp.com/mobile-battery-performance/

  20. "200k of JavaScript held within a block comment adds 240ms

    during page load, whereas 200k of JavaScript that is parsed during page load added 2600 ms."
  21. Network monitoring

  22. Charles - $50 Fiddler - windows - free

  23. http://code.google.com/p/pcaphar

  24. Make test cases

  25. 2. Close the gap http://www.flickr.com/photos/bowbrick/2093650123

  26. Save Refresh

  27. Host locally •Network Utility (mac) ifconfig en0 inet / ifconfig

    eth0 ipconfig (look for ip4v) •Point mobile to that IP •localtunnel (to get out of VMs)
  28. None
  29. jsconsole :listen

  30. weinre “Pronounced like the word ‘winery’. Or maybe like the

    word ‘weiner’. Who knows, really.” http://www.flickr.com/photos/booleansplit/6924192819/
  31. Adobe Shadow

  32. iWebInspector / Hooking Web Inspector iWebInspector

  33. jsbin.com

  34. None
  35. Aardwolf http://www.flickr.com/photos/brostad/6294164371

  36. Real debuggers http://www.flickr.com/photos/sidesh0w/6675107387

  37. Chrome for Android

  38. :1337 http://www.flickr.com/photos/blackberryimages/6932160681

  39. :7001

  40. :6000

  41. iOS6

  42. Build your own tools http://www.flickr.com/photos/jannem/3312946500 Test for events Performance metrics

    Emulate APIs & event types etc...
  43. remote-tilt.com

  44. jsbin 3 jsbin.com

  45. 3. Expect the unexpected http://www.flickr.com/photos/jdhancock/3669455809

  46. Once upon a time... Demoing mobile app Same code Same

    mobile device Same OS version But different result
  47. Wifi != ISP network

  48. msie=/*@cc_on!@*/0;

  49. Tether and check via desktop O2 you can change username

    to "bypass" to confirm bugs, not to solve them. Also will need to check with providers to be sure.
  50. iPod Touch would crash upon render

  51. Last resort debugging 50/50

  52. Emulating slow connections http://www.flickr.com/photos/63885769@N00/4696519429

  53. Network Link Conditioner (xcode + mac) Slowy.app (mac + $)

    ipfw (mac / *nix) sloppy http://www.dallaway.com/sloppy/ (java app) wipfw (windows)
  54. Beware of red herrings console.log

  55. “When you have eliminated the impossible, whatever remains, however improbable,

    must be the truth”
  56. If all else fails, take a break.

  57. We need to demand more

  58. My dream: Single Debugging Tool 1. Can we build this

    ourselves? 2. Can we hook in and normalise all the remote protocols? 3. Can we do step debugging?
  59. I think so, but it'll be a challenge.....

  60. Otherwise: rock on. @rem leftlogic.com Hire us @