Tuesday, December 9, 2008

New Favorite Javascript Editor

I love TextMate. I started using TextMate a few years ago when it was proclaimed as the "best" editor in the Ruby on Rails community. Long since I stopped writing RoR, I'm still using TextMate for HTML, CSS and Javascript. It's got great snippets, hot themes, I like the indenting, it's very light-weight, it's got great tag matching and people write cool plugins/scripts for it. There are definitely 1,001 things I like about it.

But as I have been writing a lot of code each day for a few months now, I have begun to realize how many of my errors are caused by misspellings (p.s. I just had to spell-correct that) and stupid forgetfulness. I can't even tell you how many times I've renamed a function and had to go digging around the code for 5-10 minutes to see what else needs to be changed. I would say that around 70% or more of my errors are stupid errors. This sucks. I shouldn't be wasting my time because I don't type perfectly, or because I don't have all of my variable names memorized, or even because I forget that I'm working with an object, not an array, so I can't for (i=0; i<object.length; i++) through it.

What I wanted was code completion with introspection and an as-I-type error checker that is more powerful than JSLint. See, JSLint only checks for boring syntax errors. It checks for the things that are the 30-second-to-fix-Firebug-found-it-immediately-anyways errors. And since Firebug is just as good as JSLint then why bother with JSLint?

I wanted error checking for the gotcha's, the things like:
<body>
<script type="text/javascript">
document.write("<script>alert('hi');</script>");
</script>
</body>
In that code, the </script> in the document.write should be <\/script>, otherwise it will escape the parent <script> tag. I want something that will check for unused functions/variables, deprecated Javascript, using a reserved word as a name. I wanted a real IDE for Javascript.

I played around with 4 IDE's that I thought would be good for Javascript: Komodo Edit/IDE, Eclipse, IntelliJ and Aptana. Hands down IntelliJ is the best. It had practically everything I wanted.

My Love for IntelliJ is as follows:
  • Introspection for auto-complete. IntelliJ not only knows that <code>document</code> has a method <code>write</code>, it also knows that up above you have a variable named <code>myVar</code> and an object with 6 prototype methods. And when you try to use them it autocompletes for you. But what's more is that it checks your script includes and autocompletes those for you. So if I am in a.html and I'm writing in a script block, if I am typing a method for object <code>myObj</code> then it will auto-complete that for me.
  • Error checking. IntelliJ yells at me every time I misplace those semi-colons and commas. This saves me from having to waste my time refreshing my code in the browser.
  • Easy refactoring of method/variable names.
  • Auto-cleans up extra white spaces.
  • Millions of options. Literally everything is configurable. There is a search box Just For The Preferences
  • You can debug Javascript just like with Firebug, without having to switch to your browser. Breakpoints included.
  • Easy finding of definition/use of objects. If I want to see where a method is defined, it's just one click away.


So go download the free trial and try it out for yourself. It's really the best.

0 comments: