Premature optimization is the root of all evil

Other April 24th, 2009 @ 10:04

From time to time, discussions pop up on how to optimize your code. “Create your arrays like this”, “define your variables like that” etc. Today I read a blog post by Sean Moore, summarizing a lot of (alleged) performance optimizations in AS3. It contains quite a few incorrect points, but probably serves quite good as a place to find out the truth behind some optimization myths. There are a few interesting comments in the “comments section”…

Anywho. My opinion is that you should rarely bother to do this kind of micro optimizations of your code. Maintainability and readability of the code is way more important, especially in larger products as those we’re working on. People should put more effort in that area, than saving a nano second here and there. (Also, there’s often far better places to optimize the code than in variable declarations and arrays…)

I hate it when I come across code like this (JavaScript in this example):

var i = 0, j = 1, k = 2;

… as opposed to the more human readable:

var i = 0;
var j = 1;
var k = 2;

There’s no real reason what so ever to write code like that! It just makes it harder to read and maintain.
I guess maybe that’s why I’m not a preacher of the chaining madness in jQuery…

(The headline is a quote from Donald Knuth, which I think applies to any programming language, at least all of those I’ve been working with).

Is jQuery really that awesome?

JavaScript March 11th, 2009 @ 10:03

There is (and has been for a while) a lot of buzz around the JavaScript framework jQuery. It’s even gone so far that people (mainly softcore developers or non-developers) have started referring to Javascript/AJAX features (animations etc) as “jQuery features” (maybe not that wording, but in concept).

I guess one reason for jQuery being so popular is that it’s pretty light-weight and contains both useful “core” functionality, as well as easy ways of creating transitions/animations. It’s got a pretty wide and deep range of functionality.

Prototype and YUI are my old friends

I’ve mainly been using Prototype the past years and think it’s an awesome library. It’s got great functionality for traversing the DOM, handling AJAX requests and so on. But doesn’t have any easy-to-use fade or scrolling effects. That’s probably a great advantage of jQuery: it can be used for pretty much everything within a site.

I addition to Prototype, I’ve been using YUI for animations, widgets etc etc. Truly a great library too, but maybe a bit too heavy…

Now I’m not saying that Prototype in combination with YUI is the perfect solution. It’s a good enough solution, given that Prototype’s core features combined with YUI’s widgets are quite powerful. But combining several libraries can never be a truly good thing in the end, as it can get a bit confusing what to use where in the code. Also, it could make it more difficult to update to new versions.

It’ll be really interesting to see what YUI3 can provide us with, though! From what I’ve understood, it’ll contain all the nice widgets provided by today’s YUI, but slimmed down to less and more effective code. Maybe it can prove to be the ultimate library?

Don’t chain ’til you drop!

Now I haven’t been using jQuery to any large extent (yet), but there’s one thing that’s annoying me so far:

The overly excessive desire to chain everything into one line of code (OK, maybe that was exaggerating, but sort of…). Chaining code can be nice and make code more effective, but there’s only so much chaining you should do. Otherwise, your code will only be more and more difficult to read, while saving a few fractions of milliseconds here and there because you didn’t create a new var.

A colleague of mine came up with a good suggestion to only chain as far as the starting reference is needed. Meaning, if you’re performing actions on an element, you should only chain until you stop using that particular reference.

Example of some crazy chaining:

// clear foo, update text, create a clone and update its text
$("foo").empty().text("foo-text").clone().text("foo-clone-text");

Instead, this is how it should be written to understand what it does:

// clear foo and set text
$("foo").empty().text("foo-text");

// create a copy of foo and set text
$("foo").clone().text("foo-clone-text");

Now, maybe that wasn’t a perfect example. But my point being that chaining is OK as long as it’s easy to understand in what context the code is applied. Otherwise you’ll just confuse everybody else, and in the end yourself as well.

So what am I saying?

All in all: jQuery is a great JavaScript library. I’m not buying the hype to 100% and I’m not liking it enough to say that I’ll start using it instead of Prototype just yet, but as their community is so large, there’s obviously a good chance that they’ll keep evolving to something even better. Large and good communities are often an important thing when it comes to these things.

We’re currently only using jQuery sparingly in a couple of our products, so I will have more to say after we’ve evaluated it a bit more.

When I chose to use Prototype over jQuery, I did it because it was considered the best library at that point. It’s interesting that it can change pretty quickly: today, jQuery is considered the best and fastest library out there. Maybe it’ll change again…?