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

GOTOcon 2012: Taming JavaScript with Cloud9 IDE...

Sponsored · Your Podcast. Everywhere. Effortlessly. Share. Educate. Inspire. Entertain. You do you. We'll handle the rest. →
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
量子クラウドサービスの裏側　〜Deep Dive into OQTOPUS〜
Avatar for OQTOPUS oqtopus
0
130
AWS Network Firewall Proxyを触ってみた
Avatar for nagisa_53 nagisa53
1
240
AI駆動開発を事業のコアに置く
Avatar for 鬼澤輔 tasukuonizawa
1
280
小さく始めるBCP ― 多プロダクト環境で始める最初の一歩
Avatar for kekke-n kekke_n
1
450
茨城の思い出を振り返る ～CDKのセキュリティを添えて～ / 20260201 Mitsutoshi Matsuo
Avatar for SHIFT EVOLVE shift_evolve
PRO
1
340
Context Engineeringの取り組み
Avatar for nutslove nutslove
0
370
学生・新卒・ジュニアから目指すSRE
Avatar for Hiroya Onoe hiroyaonoe
2
650
Data Hubグループ 紹介資料
Avatar for Sansan, Inc. sansan33
PRO
0
2.7k
仕様書駆動AI開発の実践： Issue→Skill→PRテンプレで 再現性を作る
Avatar for 西岡 賢一郎 (Kenichiro Nishioka) knishioka
2
680
[CV勉強会@関東 World Model 読み会] Orbis: Overcoming Challenges of Long-Horizon Prediction in Driving World Models (Mousakhan+, NeurIPS 2025)
Avatar for abemii_ abemii
0
140
SREが向き合う大規模リアーキテクチャ 〜信頼性とアジリティの両立〜
Avatar for Kuniaki Moriya zepprix
0
460
Cosmos World Foundation Model Platform for Physical AI
Avatar for Takuya MINAGAWA takmin
0
940

Featured

See All Featured
Gemini Prompt Engineering: Practical Techniques for Tangible AI Outcomes
Avatar for Mfonobong Umondia mfonobong
2
280
The Pragmatic Product Professional
Avatar for Laura Van Doore lauravandoore
37
7.1k
Dominate Local Search Results - an insider guide to GBP, reviews, and Local SEO
Avatar for Greg Gifford greggifford
PRO
0
78
CSS Pre-Processors: Stylus, Less & Sass
Avatar for Bermon Painter bermonpainter
359
30k
ReactJS: Keep Simple. Everything can be a component!
Avatar for Pedro Nauck pedronauck
666
130k
Max Prin - Stacking Signals: How International SEO Comes Together (And Falls Apart)
Avatar for Tech SEO Connect techseoconnect
PRO
0
86
Done Done
Avatar for chrislema chrislema
186
16k
Navigating Weather and Climate Data
Avatar for Ryan Abernathey rabernat
0
110
Darren the Foodie - Storyboard
Avatar for Kevinho.art khoart
PRO
2
2.4k
Bash Introduction
Avatar for André Augusto Costa Santos 62gerente
615
210k
Tips & Tricks on How to Get Your First Job In Tech
Avatar for Honza Javorek honzajavorek
0
440
Winning Ecommerce Organic Search in an AI Era - #searchnstuff2025
Avatar for Aleyda Solis aleyda
1
1.9k

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