Pro Yearly is on sale from $80 to $50! »

The future of DevTools with RemoteDebug

The future of DevTools with RemoteDebug

JSCamp, Romania, June 2015

49f28eff1d0ddf3564a1b8b1f36a6c12?s=128

Kenneth Auchenberg

March 27, 2016
Tweet

Transcript

  1. The future of DevTools with RemoteDebug. JSCamp, Romania, June 2015

    Kenneth Auchenberg
  2. DevTools. DevTools. DevTools @auchenberg 2/60

  3. I realized something Our industry has a DevTools dogma. @auchenberg

    3/60
  4. 2007: IE Developer Toolbar @auchenberg http://sixrevisions.com/tools/internet_explorer_extensions_addons_web_developers/ 4/60

  5. 2015: Chrome DevTools @auchenberg 5/60

  6. Question Is this really the best we can do? @auchenberg

    6/60
  7. Thought experiment @auchenberg Why do I need to learn a

    new DevTools for each browser? Why do I have to use different tools for authoring and debugging? Why isn't my editor integrated with my browsers? Why can't I decide which DevTools to use with my browsers? Why can't I use DevTools to debug my mobile apps? Why can't I leverage the browser logic in my new fancy tool? Why are DevTools bundled with our browsers? · · · · · · · 7/60
  8. Moden DevTool's are collections of tools @auchenberg 8/60

  9. Debugging context @auchenberg 9/60

  10. A fraction of our screens @auchenberg 10/60

  11. Authoring context @auchenberg 11/60

  12. Our workflow is broken Authoring tools !== Debugging tools @auchenberg

    12/60
  13. Disconnect @auchenberg 13/60

  14. What if... Authoring tools === Debugging tools @auchenberg 14/60

  15. What if... @auchenberg 15/60

  16. We have tried, and failed @auchenberg 16/60

  17. Security model @auchenberg 17/60

  18. There's a better way! @auchenberg 18/60

  19. There's a better way! Remote debugging protocols @auchenberg 19/60

  20. No common protocol @auchenberg 20/60

  21. RemoteDebug was born @auchenberg 21/60

  22. RemoteDebug vision @auchenberg 22/60

  23. RemoteDebug vision An API to our browsers. @auchenberg 23/60

  24. Isn't this WebDriver? It's a low-level API to our browsers.

    @auchenberg 24/60
  25. RemoteDebug So how far are we? @auchenberg 25/60

  26. @auchenberg Protocol adaptors 26/60

  27. Protocol adaptors @auchenberg 27/60

  28. Safari protocol adaptor @auchenberg 28/60

  29. Firefox protocol adaptor @auchenberg 29/60

  30. IE protocol adaptor (Edge?) @auchenberg 30/60

  31. @auchenberg RemoteDebug Gateway 31/60

  32. RemoteDebug Gateway @auchenberg 32/60

  33. RemoteDebug Gateway @auchenberg 33/60

  34. @auchenberg Integrations 34/60

  35. Adobe brackets @auchenberg 35/60

  36. Microsoft Visual Studio @auchenberg 36/60

  37. Other editors too @auchenberg 37/60

  38. Calibre @auchenberg 38/60

  39. @auchenberg Re-use across platforms 39/60

  40. Strongloop Node Inspector @auchenberg 40/60

  41. Square PonyDebugger @auchenberg 41/60

  42. Facebook Stetho @auchenberg 42/60

  43. Facebook Stetho @auchenberg 43/60

  44. @auchenberg Similar initiatives. 44/60

  45. Mozilla Firefox Protocol Adaptors @auchenberg 45/60

  46. Mozilla Firefox Developer Edition @auchenberg 46/60

  47. @auchenberg Perspective. 47/60

  48. Taking DevTools outside the browser @auchenberg 48/60

  49. Thought experiment revised @auchenberg Why do I need to learn

    a new DevTools for each browser? Why do I have to use different tools for authoring and debugging? Why isn't my editor integrated with my browsers? Why can't I decide which DevTools to use with my browsers? Why can't I use DevTools to debug my mobile apps? Why can't I leverage the browser logic in my new fancy tool? Why are DevTools bundled with our browsers? · · · · · · · 49/60
  50. BrowserRemote @auchenberg 50/60

  51. BrowserRemote @auchenberg 51/60

  52. BrowserRemote @auchenberg 52/60

  53. @auchenberg Going forward. 53/60

  54. Let's stop reinventing our tools. @auchenberg 54/60

  55. Let's reuse our tools. @auchenberg 55/60

  56. Let's make it easier to build for the web. @auchenberg

    56/60
  57. We need a sane development workflow. @auchenberg 57/60

  58. The open web follows standards. @auchenberg 58/60

  59. Our tools should too. @auchenberg 59/60

  60. Thanks. twitter @auchenberg www kenneth.io