Upgrade to Pro — share decks privately, control downloads, hide ads and more …

GOTOcon 2012: Taming JavaScript with Cloud9 IDE...

Avatar for zef zef
May 30, 2012
Technology
1
120

GOTOcon 2012: Taming JavaScript with Cloud9 IDE: a Tale of Tree Hugging

My talk on TreeHugger.js at GOTOcon.

Avatar for zef

zef

May 30, 2012
Tweet

More Decks by zef

See All by zef
Pick Your Battles
Avatar for zef zef
1
150
GeeCON 2012: Coding in the Cloud
Avatar for zef zef
2
340

Other Decks in Technology

See All in Technology
BidiAgent と Nova 2 Sonic から​考える音声 AI について
Avatar for Yuuki Yamashita yama3133
2
100
Strands Agents × インタリーブ思考 で変わるAIエージェント設計 / Strands Agents x Interleaved Thinking AI Agents
Avatar for Takanori Suzuki takanorig
5
2.2k
2025-12-18_AI駆動開発推進プロジェクト運営について / AIDD-Promotion project management
Avatar for yayoi_dd yayoi_dd
0
170
Agent Skillsがハーネスの垣根を超える日
Avatar for Gota gotalab555
6
4.6k
20251222_サンフランシスコサバイバル術
Avatar for ponponmikan ponponmikankan
2
140
AWSの新機能をフル活用した「re:Inventエージェント」開発秘話
Avatar for みのるん minorun365
2
490
Knowledge Work の AI Backend
Avatar for KNOWLEDGE WORK / 株式会社ナレッジワーク kworkdev
PRO
0
290
Redshift認可、アップデートでどう変わった？
Avatar for daiki.handa handy
1
100
7,000万ユーザーの信頼を守る「TimeTree」のオブザーバビリティ実践 ( Datadog Live Tokyo )
Avatar for bell033 bell033
1
100
フィッシュボウルのやり方 / How to do a fishbowl
Avatar for Pauli pauli
2
400
AI with TiDD
Avatar for Shiraji shiraji
1
310
Bedrock AgentCore Memoryの新機能 (Episode) を試してみた / try Bedrock AgentCore Memory Episodic functionarity
Avatar for hoshi7_n hoshi7_n
2
2k

Featured

See All Featured
The Web Performance Landscape in 2024 [PerfNow 2024]
Avatar for Tammy Everts tammyeverts
12
980
Into the Great Unknown - MozCon
Avatar for Noah Learner thekraken
40
2.2k
Future Trends and Review - Lecture 12 - Web Technologies (1019888BNR)
Avatar for Beat Signer signer
PRO
0
3.1k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
Avatar for Tammy Everts tammyeverts
10
760
Building a Scalable Design System with Sketch
Avatar for Laura Van Doore lauravandoore
463
34k
Ten Tips & Tricks for a 🌱 transition
Avatar for Manu Carrasco Molina stuffmc
0
37
Paper Plane
Avatar for Katie Cordina Lindsey katiecoart
PRO
0
44k
Speed Design
Avatar for Sergey Chernyshev sergeychernyshev
33
1.4k
16th Malabo Montpellier Forum Presentation
Avatar for AKADEMIYA2063 akademiya2063
PRO
0
32
Keith and Marios Guide to Fast Websites
Avatar for Keith Pitt keithpitt
413
23k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
Avatar for Tammy Everts tammyeverts
55
3.2k
Building an army of robots
Avatar for Kyle Neath kneath
306
46k

Transcript

  1. Taming JavaScript with Cloud9 IDE: a Tale of Tree Hugging

    Zef Hemel (@zef)
  2. None
  3. None
  4. None

  5. .js

  6. browser.js

  7. db.js

  8. server.js

  9. *.js

  10. None

  11. ~140,000

  12. Tooling matters

  13. None

  14. JavaScript Developer

  15. None
  16. None
  17. None

  18. HTML CSS JavaScript

  19. HTML5 CSS3 JavaScript Client

  20. HTML5 CSS3 JavaScript Client Node.js Redis Server

  21. HTML5 CSS3 JavaScript Client Node.js Redis Server XMLHttpRequest HTML5 WebSockets

  22. Mozilla Bespin

  23. Mozilla Bespin Canvas

  24. Browser Wars 2.0

  25. DOM

  26. Sidebar

  27. Sidebar

  28. Sidebar

  29. Sidebar

  30. Sidebar

  31. Sidebar

  32. Sidebar

  33. Sidebar

  34. JavaScript C/C++ Closure CoffeeScript Coldfusion C# CSS Groovy HTML Java

    JSON LaTeX Lua Markdown OCaml Perl PHP Ruby Scad Scala SCSS SQL SVG Textile XML
  35. None

  36. ~240,000

  37. Component Systems Message Queues Decoupling

  38. None
  39. None
  40. None
  41. None

  42. Tooling matters especially for JavaScript

  43. None

  44. Unleash the awesome power of...

  45. tatic

  46. program analysis

  47. None
  48. None

  49. Iterating using undeclared variable

  50. None

  51. Warning: you are in an anonymous inner function with its

    own “this” pointer
  52. None

  53. Did you mean “length”?

  54. “The most important thing I have done as a programmer

    in recent years is to aggressively pursue static code analysis.” John Carmack

  55. How?

  56. Parse Analyze

  57. Parser Code AST

  58. Abstract Syntax Tree a * 10 Parser Op Var Num

    “*” “a” “10”

  59. Zeon UglifyJS Narcissus Esprima language.js

  60. performance (speed/memory) AST datastructure traversal tools

  61. performance (speed/memory) AST datastructure traversal tools JavaScript specific

  62. treehugger.js

  63. “The JQuery of AST analysis.”

  64. treehugger.js

  65. treehugger.js Generic AST Data structure

  66. treehugger.js Generic AST Data structure Generic Traversals

  67. treehugger.js Generic AST Data structure Generic Traversals DSL with Pattern

    Matching

  68. treehugger.js Generic AST Data structure Generic Traversals DSL with Pattern

    Matching Language- Specific Parsers

  69. treehugger.js Generic AST Data structure Generic Traversals DSL with Pattern

    Matching Language- Specific Parsers JavaScript (UglifyJS-based)

  70. treehugger.js Generic AST Data structure Generic Traversals DSL with Pattern

    Matching Language- Specific Parsers JavaScript (UglifyJS-based)

  71. a * 10 Op Var Num “*” “a” “10”

  72. Op("*", Var("a"), Num("10")) Op Var Num “*” “a” “10”

  73. Op("*", Var("a"), Num("10")) ATerm Op Var Num “*” “a” “10”

  74. Constructors Lists Strings Var(_) [_, _] "hello" Placeholders x

  75. let’s play

  76. What can you do with it?

  77. Low-level tooling

  78. None

  79. Intelligent code completion

  80. Complex refactoring

  81. Cloud

  82. Big data

  83. What if...

  84. Project 1 Project 2 Project 3 Project 4 Project 5

    Project 6

  85. Your (dev) environment matters use static analysis tools

  86. http://c9.io @zef http://github.com/ajaxorg/treehugger