Signs of a poorly written jQuery plugin

http://remysharp.com/2010/06/03/signs-of-a-poorly-written-jquery-plugin/

by jimsteinhart • 16 years ago

60 13 16 years ago

remysharp.com

NathanKP• 16 years ago

This article helped me a lot. I had always thought that it had to be written as:

$(this).each(...)

Knowing that I can use:

this.each()

will allow me to simplify things a bit.

vinhboy• 16 years ago

Yea great article. I also had a simliar misconception.

twism• 16 years ago

In the context of plugin code, "this" is a jQuery object. In event callbacks or operating on DOM elements, "this" is a plain old DOM object.

benmathes• 16 years ago

Saying $(this).somejQueryFunction() is defensive programming, it ensures that your object gets jQuery'd. If it's already a jQuery object, it's not expensive to do. This is generic advice for all the various kinds of 'this' that you'll encounter in javascript, not the specific case mentioned in the linked article.

po• 16 years ago

It does seem a bit nit-picky. I would expect that right away in the JQuery call tests if it's already a JQuery object and short-circuits. It would save you one call and it's not exactly in a tight loop.

Maybe as a sign-post that the person doesn't really understand JQuery plugins very well…

naz• 16 years ago

His second point, "Double jQuery" is because of inconstancy in jQuery itself. For all event callbacks 'this' is the relevant DOM node, but for plugin functions 'this' is a jQuery object. It is understandable that a plugin author would assume that it is a DOM node and since calling $(this) would just return itself they have no way of knowing. I wouldn't say it reflects on the plugin author at all.

dhimes2• 16 years ago

For the inline return:

    return $(this).each(fn);

I'm actually surprised that the JS engines don't do this kind of optimization automatically.

tlrobinson• 16 years ago

It's quite possible some of them do, but the performance difference is probably negligible anyway, it's just extra code that doesn't need to exist.

dhimes2• 16 years ago

I see. It speaks to a certain elegance of programming, which is a useful filter for estimating quality. I actually totally get that.

apphacker2• 16 years ago

#1. I hate the "this" keyword abuse in jQuery, this article demonstrates it clearly. #2. Some minor code style issues do not make a bad plugin.

WilliamLP• 16 years ago

By "this article", do you mean the article in question, or was that a self-reference to your own comment?

Also I ignored what you were saying because your use of a temporary placeholder in your first sentence was a red flag, indicative of poor writing. Better would have been "This article demonstrates clearly why I hate abuse of the "this" keyword in jQuery", eliminating the extra "it" altogether.

apphacker2• 16 years ago

I'm going to assume sarcasm since ignoring doesn't usually involve replying.

adamesque• 16 years ago

It's important to keep in mind that these are literally what the title makes them out to be: simple signposts that indicate poor code might lie within.

I probably wouldn't immediately toss out a plugin that exhibited one or more of these signs, but I would take it as a sign that I ought to do a slightly more thorough skimming of the code before using.

It's a shame that the jQuery plugin directory doesn't make separating the good from the bad much easier.

Signs of a poorly written jQuery plugin

Related Stories