August 23rd, 2006

JQuery: (Mis)leading the Pack

62 comments on 1236 words

I always hate election season. It’s not really the 3 billion signs you see staked at every corner, it’s the negative campaigning and slight twist of the truth by opposing candidates. Running these types of campaigns makes you look foolish, and in turn, opens you up for scrutiny.

So what does this have to do with JQuery? Well, I just finished reading a post on the JQuery blog entitled “Why JQuery’s Philosophy is Better”(than Prototype). A prime example of failure to “Get your facts straight.”

Basically the guy calls Prototype ugly, states that it’s baked into Rails and wonders why more Rails developers don’t use JQuery considering it’s philosophy is more in-tune with your your average Rails developer. To top it all off, he posts some bad code comparisons between Prototype and JQuery.

DOM Insertion: Admittedly, if you use Prototype as-is, you have to do what the article says. But, the deal here is that you can get that same functionality with a few lines in Prototype. This should be in the Prototype core, I’ll certainly give them that much.


    Element.addMethods({
      insertionBefore: function(element, content) { new Insertion.Before(element, content); },
      insertionAfter:  function(element, content) { new Insertion.After(element, content); },
      insertionTop:    function(element, content) { new Insertion.Top(element, content);  },
      insertionBottom: function(element, content) { new Insertion.Bottom(element, content); }
    });

    $("item-1").insertionBefore("<li>Sweet</li>");

So you only have to add the addMehtods bits once and you can use it like the last line to your hearts content. I do have slightly more verbose function names, because ‘before’ and ‘after’ describe a place, they don’t fully disclose the action. They haven’t quiet reached the $(element).google() status yet.

The article also says that Prototype returns a vanilla DOM node. This is false, you get all the methods of the Element object and more.

Chainability: We got it. It works.

CSS Selectors/Xpath: We’ve got CSS selectors $$(), but I doubt we’ll ever see XPath support in Prototype. It’s not really something I see a need for (Speaking for myself of course).

Plugin Development: Extensions/Plugins/Etc. Javascript is Javascript, it’s just as easy to add plugins to Prototype as it is to JQuery. The difference here is that with JQuery you have to use a fully qualified namespace (it seems) and some weird looking functional programming. Just browsing through the JQuery plugin site, it seems all of the plugins use a functional approach. Despite the articles claims, this is as far from Ruby as you’ll get.

Automatic Looping: A big paragraph of how looping elements works with insertion. He says it’s one of the day to day benefits of using JQuery. We like this in the Prototype camp too:


    $$('span').invoke("insertionBefore", 'OMG');

Ajax Updating: Yeah, it sucks, it’s verbose. I agree.

Adding a class to an element:


$(element).addClassName('omg');

Adding a class to a group of elements:


    $$('span').invoke("addClassName", 'omg');

So, most of the talking points of the entire article are misleading as I’ve shown. It would be mighty square of them to correct the article.

I really don’t think the author is intentionally misleading, I just think know his knowledge of Prototype is modest at best. I won’t pretend to write JQuery comparisons to Prototype, because frankly, I don’t know JQuery enough to make an accurate comparison.

So this brings me to my last point. Does JQuery really pack anything new or revolutionary enough for Prototype users to swap? Has it really brought anything new to the table? After all, a lot of JQuery was inspired by Prototype. The main thing I see JQuery touting is file size and I’ve already had my say on that. It gets you a big bowl of alphabet soup (I hear John is addressing this though with the new version coming soon):


jQuery.parents = function(a){
    var b = [];
    var c = a.parentNode;
    while ( c && c != document ) {
        b[b.length] = c;
        c = c.parentNode;
    }
    return b;
};

Here’s the twister though. I hope JQuery continues to do great. It only means good things for Prototype. Jhon is a smart guy who has done an amazing job with JQuery and he continues to stay vocal in the community and let his users know exactly what’s going on, something Sam fails at miserably. I won’t speculate as to why thats the case.

So, yes, we do have our problems in the Prototype camp, the primary two being the complete lack of transparency about what’s going on and limited documentation. It has very little to do with the code being ugly, you just have to know how to use it well enough to not write ugly code.

Discussion

  1. Sean Sean said on August 23rd

    Ok, your last sentence is true, so that leads me to…

    Where’s the book! :)

  2. Jason Long Jason Long said on August 23rd

    Thanks for another great post on using Prototype. I find that your posts are one of the few ways to learn about the power of the library.

    You hit on the lack of documentation, but what other resources would you point someone who is looking to get their Prototype-fu on?

  3. Les Les said on August 23rd

    Yes, where’s the book ? :):):)

  4. Kingsley Kingsley said on August 23rd

    Having tried to use both, I can say that jQuery felt a lot more natural to me, with no background in Ruby. It closely matched a toolkit I had written for myself pre-Prototype (which had essentials like chained methods and iterators), and added very elegant AJAX support.

    jQuery is now my library of choice, and I haven’t kept up with prototype since.

  5. justin perkins justin perkins said on August 23rd

    Does JQuery really pack anything new or revolutionary enough for Prototype users to swap?

    Nothing that can’t be easily added to prototype :)

  6. Yehuda Katz Yehuda Katz said on August 23rd

    Thanks for the rundown. You’re absolutely correct that I’m no Prototype guru, and that’s why I missed the features you discussed above.

    That said, you have to admit that they are kind of obscure, and Prototype’s poor documentation makes it very difficult to work out when there are fundamentally useful, framework-wide features like binding the Element module to DOM Elements, for instance.

    That said, there’s still a fundamental difference between the philosophies of jQuery and Prototype. While jQuery has iteration and chainability built-in by design (and it’s therefore available in virtually all jQuery functions and plugins), Prototype adds it in after the fact as an additional feature that is not at all pervasive.

    I didn’t mean to bash Prototype. I’ve used it to quite good effect. And your tips (specifically the use of invoke, an amazing addition) will assist my Rails work, which still requires Prototype.

    I’m a believer in jQuery for the reasons I stated in my article, but also for peripheral reason, like automated building and testing, automated inline documentation, and a maintainer who believes in the community and understands its needs.

    Again, my intention was mainly to compare the underlying design philosophies (monolithic classes vs. message passing), and I believe my comparison still stands (despite some excellent magic with invoke that helps quite a bit).

    One last thing: the plugin architecture in jQuery doesn’t require the use of a specific namespace. Using jQuery.fn, however, will automatically apply the iteration and chainability magic I discussed in my article to plugins. Where appropriate, plugin developers have hooked into the design philosophy.

  7. Sam Sam said on August 23rd

    One more line for your AddMethods:

    ajax: function(element, url, options) { new Ajax.Updater(element, url, options); }

    Sorted. :)

    Long live prototype!

  8. Justin Palmer Justin Palmer said on August 23rd

    @Justin: Indeed! I hate to say it, but this in itself is a big problem with the current state of affairs.

    @Yehuda: I agree that invoke is sorta obscure with respect that documentation is practically non-existant on it excluding this article I published about 8 months ago . It has however been in Prototype since it’s inception for all to see.

    Prototype has automated building and testing, but it doesn’t include it with the release. It also has a console, inspector, and unit test for methods like invoke in the repo.

    I don’t doubt for a minute Sam’s dedication to the community, he’s simply not a vocal character.

    On ‘Monolithic classes’. I really don’t see the ‘Monolithic’ part. Encapsulation is a great thing. Prototype will always follow a class like structure, it’s just good design for maintaining scripts as they scale. Prototype has inheritance issues, but they are easily fixed. I’ve yet to see any OO examples including inheritance in JQuery. I’m really interested in this though.

    So how does inheritance work with JQuery? Can you invoke superclass methods? Does it have class initialization, static methods and instance methods? I’m genuinely curious about this.

    With all that said, I don’t think you set out to bash Prototype, but I firmly believe your article to be misleading.

  9. Andrew Dupont Andrew Dupont said on August 23rd

    There are a couple things that bother me here.

    First: why does JQuery feel the need to criticize Prototype? Any of these complaints would ring doubly true for Dojo or MochiKit or YUI, so if brevity is your only metric then Prototype is nowhere near the worst offender.

    Second: why is one’s toolkit choice a matter of politics rather than one of taste? Obviously Dojo is more verbose than JQuery, but there are tradeoffs. Dojo does more stuff. Each toolkit is different from the others in more than one dimension, so you can’t really quantify how good one is relative to another.

    Third: why is this seen as a zero-sum game? When someone chooses JQuery, I don’t lament that Prototype has lost another potential convert. If one framework were to “beat” all the others, we’d end up with a milquetoast code library that satisfied nobody. The friendly competition between frameworks is good for JavaScript in general.

    It troubles me that Prototype seems to be in the crosshairs. It’s been sneered at by developers of most of the other toolkits—most notably Dojo’s Alex Russell, but also Bob Ippolito (of MochiKit) and now John Resig of JQuery. Why is Prototype the lightning rod?

    @Sean, Les: Patience. Patience will be rewarded. :)

  10. Yehuda Katz Yehuda Katz said on August 23rd

    Justin,

    I’m going to get you more details about inheritence soon.

    I stand by my assessment that jQuery sees an element, or element array, as the fundamental entity in a JS framework, and wraps its functionality around it.

    Prototype looks at the different functions that need to be achieved in JS (form functionality, functionality regarding elements, array functionality, event functionality, etc.).

    Prototype has done some work to bridge the gap (invoke, Element binding), but the fundamental philosophy is still different.

    As a result, people who think about JS programming as fundamentally relating to DOM elements will appreciate jQuery’s model. People who think about JS programming as relating to the particular functions that need to be achieved in the flow of an application will like Prototype.

    One obvious example I can think of is the way the frameworks handle event handling. Prototype uses an Event class, which wraps the various types of things you’d need to do inside an event handler.

    jQuery sees event handling as fundamentally relating to the elements the events are bound to. As a result, functionality adding in via the behaviour library is built-into jQuery.

    The AJAX difference is not just a matter of code prettiness. jQuery thinks of AJAX updaters the same way it thinks of everything—a method called on a series of elements. Prototype sees it as yet another AJAX function, with a parameter that allows you to specify an ID. (I don’t think invoke trickery could work for loading the AJAX response into multiple DOM Elements, could it?)

    I never meant to impugn the good work of the Prototype Community of its maintainer. Healthy competition is good.

  11. Nate Nate said on August 23rd

    I would like to note, the article on jQuery was written by a 3rd party, not the developer of jQuery.

  12. justin perkins justin perkins said on August 23rd

    After reading Yehuda’s comments above..

    There’s more to a page than just DOM elements, so I actually appreciate the fact that prototype is broken apart into different components (Elements, Events, Position, Forms, Helpers, Utilities, etc..).

    And regarding the Ajax thing, attaching a call to a certain ID is merely one way to call Ajax, but not a requirement. I’m sure all Rails developers are happy to just turn on evalScripts (not specifying an element ID to update) and let RJS pass back all the rest of the behavior for execution.

  13. Adrian Tanase Adrian Tanase said on August 23rd

    I used both libraries, JQuery by choice and Prototype because it’s baked into another cool AJAX library, AJAXPRO.NET.

    What I feel that Prototype is really lacking is what JQuery was actually built for: the DOM querying part. $$ is really simple compared to what you can accomplish with JQuery.

    I’ve got at least 3 problems that prototype’s $$ doesn’t solve for me.

    1. SCOPE. In JQuery’s $ method you can supply the scope of the search by sending a DOM element as a second parameter—really useful when using closures and sending a this reference. You can just say $("input", this) without really caring where in the DOM you are.

    2. MULTIPLE selectors. I just want to say $$("p.one, div.two, .etc"). No way in prototype (at least when I last looked at it).

    3. Useful CHAINABILTY. What I mean by this is being able to say something like:

    $("#content").find("h1, h2, h3").not(".article h2").addClass("sifr");

    Well.. all I want to say is that for me JQuery really put the fun back into writing JavaScript. I now feel comfortable in approaching tasks that in the past I would put off indefinitely because of how much code it would have taken.

  14. Martin Ström Martin Ström said on August 23rd

    I love prototype but the chaining doesn’t really work because the methods doesn’t return the element. So while you can do 

    $('elm').show()
    you can’t do 
    $('elm').show().addClassName('css')
    which should work. A simple patch to addMethods should fix that though.

    @Adrian Tanase: MULTIPLE selectors, just pass your selectors as own parameters: 
    $$('div', '#mydiv', 'span.email').each(...)
  15. Adrian Tanase Adrian Tanase said on August 24th

    @Martin: cool, thanks for the tip. For my third example though, the Prototype code would be a lot larger, including filters, checking for parents, etc.

    I would love to be able to use JQuery for querying the DOM together with Prototype for other tasks (such as AJAX transport, very nicely designed, although a little verbose).

  16. Yehuda Katz Yehuda Katz said on August 24th

    AJAX is actually one of the few places where jQuery’s logic is decoupled from elements (with the exception of $().load).

    Specifically, jQuery’s syntax (as of 1.0) is: $.ajax({ url: “request url”, type: “POST, GET, etc”, data: “query data”,

    complete: function(){},
  success: function(){},
  error: function(){}
});

    This is a case where the AJAX logic has no obvious connection to any particular DOM Element, so jQuery provides an exception to its normal logic. jQuery also provides $.ajaxStart and $.ajaxStop if there’s a particular set of functionality you want to occur when any AJAX action starts or stops (loading graphic, for instance, a la Google).

    justin perkins: You’re right that there’s more to JS development than DOM elements. That’s part of the reason some people feel more comfortable with Prototype. That said, JS development is, in large part, the manipulation of DOM elements in response to user input or loaded data. A framework that makes the choice of prioritizing DOM collections makes a number of programming tasks easier.

    That said, I repeat that Prototype is an excellent framework that was on the vanguard of JS framework development. I only wish it was better documented and more frequently updated.

  17. Nate Cavanaugh Nate Cavanaugh said on August 24th

    I think the problem with Prototype is probably jQuery’s greatest strengths, and that is the 3 d’s: documentation, dedication, and developer support.

    jQuery is marketed MUCH better than prototype (15 days of jQuery, the tutorials, etc etc.)

    But in practice, I would say the actual depth of the two is quite different. jQuery is like PaintShopPro: robust in it’s own right, but it’s not Photoshop.

    Prototype is the THE Photoshop of the Javascript libraries. It’s depth is amazing, and it’s power incredible.

    (I know Dustin will have my balls for not including YUI in this, but that deserves it’s own little entry :) ).

    I think one of the main problems with Prototype isn’t JUST documentation (of which there are some places that document it fairly well), but the problem is showing those unfamiliar with it what exactly is so cool about it, which jQuery does.

    I think you’re doing a great job of that Justin, but I think some of your discussions are a bit above the heads of most folks starting out with Prototype (as well it should be, though). There needs to be a place where those starting out can start using some training wheels with Prototype, cut their teeth on a few of it’s magic goodies, and then delve deeper.

    THAT is where I think jQuery kicks some major butt.

  18. DHH DHH said on August 24th

    Regarding Prototype documentation: It seems that there is a good many proficient users out there, if not experts, who could greatly help the project by documenting what they know.

    The manual for Prototype type needs not be written exclusively, or at all, by Sam Stephenson. If you like Prototype, know enough about it to be worth sharing, please do band together and start a documentation effort.

    The Ruby standard library is a great example of a major code base with skimp documentation before the Ruby Doc team got going. We can do the same with Prototype. Please help improve this commons.

  19. Yehuda Katz Yehuda Katz said on August 24th

    DHH,

    I’d be perfectly happy to provide Prototype documentation writers with the code for my Visual jQuery XSLT transformation and help using it.

    If Prototype folks can put together an XML file with the same schema as the jQuery docs, they’ll have an instant way to visually represent the docs.

  20. Andrew Dupont Andrew Dupont said on August 24th

    I apologize for attributing that post to John Resig — as Nate pointed out, it was written by a third party. But it was posted on the official JQuery blog, so I’m assuming it carries the endorsement of the JQuery project in general.

  21. Tobie Tobie said on August 24th

    I think the problem with Prototype is probably jQuery’s greatest strengths, and that is the 3 d’s: documentation, dedication, and developer support.

    I definitely agree with you Nate. I posted my thoughts on Yehuda’s post over at my blog yesterday… and within minutes received extended comments from both Yehuda and John Resig, clearing-up some if not all of the points I had brought up. Now that really shows dedication to the community. Note that I am not saying that Sam is not dedicated to Prototype’s community, it is just that it does not show.

    As I mentioned in my post, what could eventually make me ditch my favorite framework is neither a possibly nicer syntax nor a 10kb file size but the following:

    1. a responsive and present maintainer,
    2. good docs, and
    3. a tight community.

    Again, I don’t wont to bash on Sam - Prototype is a piece of art, a pleasure to work with… and has taught me OO javascript - but the fact is that his absence from the Prototype community has created a sense of insecurity which has really become palpable lately.

    Prototype doesn’t necessarily lack documentation, it is just - like it’s community - scattered all over the web, with gems here and there.

    I do not think that discussing further whether or not Yehuda’s post was misleading is of great importance.

    Neither do I believe that mac vs. pc like flame-wars will benefit the JavaScript community as a whole.

    Rather, let’s consider this as an opportunity to tighten the Prototype community, centralize the available documentation and get a stable Prototype version 1.5 out as soon as possible.

    As Yehuda rightfully said:

    Healthy competition is good.

    and from what I’ve peeked into jQuery so far, I can already imagine how both libraries could help each other vastly improve.

    I really don’t have the status in the community (nor the knowledege) to lead such an effort. However, I am more than willing to contribute to it as much as I can.

    P.S. some not totally out of topic shameless self-promotion: I posted about extending Prototype to provide a better syntax for DOM insertion over at my blog just about a week ago. There is small demo available, and any comments in my newly-born (and first) blog are welcomed.

  22. justin perkins justin perkins said on August 24th

    I don’t see why Sam is the focus of a lot of prototype’s criticism. So he doesn’t come comment on a blog everytime his name is mentioned, big deal. Not everybody is into “staying in touch with the community”.

    He made an awesome framework, then pretty much left it up to others to continue vision. If you want more documentation, write it.

  23. Justin Palmer Justin Palmer said on August 24th

    Word. Mistaking the lack of public speaking for the lack of commitment is just as foolish as the article that prompted this post….which is still incorrect at the time of this comment.

    On a positive note, I’ve spoken to Sam since this post and he’ll be working on Prototype today, getting the pressing issues fixed, and who knows, he might have a surprise or two up his sleeve. Stay tuned for an update this weekend or early next week.

  24. Paul Watson Paul Watson said on August 24th

    I shifted to jQuery exactly because things like invoke are obscure in prototype. I never knew that existed while with jQuery I was up and running with the same functionality in a matter of minutes. I hope prototype gets some jQuery like documentation and marketing, it needs it.

  25. Tobie Tobie said on August 25th

    Mistaking the lack of public speaking for the lack of commitment is just as foolish…

    Fully agreed.

    If you want more documentation, write it.

    There’s plenty of great documentation available for Prototype.

    What’s missing though is one place where it would be centralized. And as it has been rightfully pointed out above by DHH, we should just “band together and start a documentation effort.”

    Any volunteers?

  26. Igwe Igwe said on August 25th

    The earlier article “Why Chef Boyarde doesn’t use Javascript” is interesting and quite true. In many ways, the size of Javascript files doesn’t really matter. However try to look at it from a different perspective. If product B does everything that product A does, and product B is also half the size of A, is that not a good thing?
    This is why today we have laptops and blackberries instead of being stuck with computers the size of a garage. Smaller usually means progress and advancement. I only used jQuery last week and to be honest, I was pleasantly suprised. Add to this the fact that I can read the blog, visual docs, multiple tutorials e.t.c. It really helps you get started pretty quickly. So prototype really needs a community. Hopefully your new book can help jumpstart this.
    However it hasn’t by any means diminished my love for Prototype. I still use it every single day. If size is an issue I was able to get Prototype down to 35kb with the Dojo compressor. The packer by “Dean Edwards” does an even better job by compressing it to 22kb, only 6kb more than jQuery. You may want to make mention of that in your book.
    I hope both camps learn from each other. Maybe Sam can offer a compressed version of prototype as well. It’s also important to note that community really really matters.
    Filesize doesn’t determine which framework is better, but it certainly gives that impression, especially when you ask “What can I do here that I can’t do there?” and get very few answers. Even Tomas Fuchs has made mention of a scriptaculous lite and I think this is the right direction. Impressions are what really matters, as Kathy Sierra will tell you, emotions matter more than logic to most people.

  27. Alex Alex said on August 25th

    Justin, it would be great for Prototype if it was maintained by a group instead of just Sam, the fact that he is not very vocal in the comunity is a big problem with the perseption of support and comitment. If for example, you (Justin) where to play a more active roll in a prototype development team, things would be much better.

    PS, it probably doesnt help prototype’s case that this blog spits out javascript errors in the hundreds!!

  28. Rey Rey said on August 25th

    @Justin & Justin:

    As someone that’s just diving into Ajax, I have to say that I would definitely appreciate, at the very least, a centralized place to find documentation on Prototype. Tobie nailed it when he made the same comment. I’d like to be as productive as possible in the shortest amount of time and having to forage through Google or a .js file to understand the ins and outs of a product isn’t viable.

    Personally, I don’t care if Sam ever comments on anything because some people just like to stay behind the scenes. Thats perfectly cool. But I have to agree with another poster that showing some regular activity on the project would help the perception that Prototype is moving forward and continues to be a viable library for building web apps. A centralized project home with regular news updates would go a long way.

    Again, I’m trying to give you a perspective from someone just starting out and trying to make a decision on which framework/library to embrace for the immediate future.

  29. Brad Brad said on August 25th

    I was recently looking into frameworks and two weeks ago relaunched with jQuery. The deciding factor was, in fact, the jQuery philosophy. I had painstakingly written DOM creation and manipulation code myself but was more than happy to throw it away for John’s practical approach. Dojo and Prototype philosophies tend to think that there’s “Nothing that can’t be easily added” to quote Justin. That kind of crust accumulation, frankly, frightens me. I’m not yet using jQuery 1.0a, but from what I’ve read on the blogs, John’s evolutionary approach isn’t accumulative.

    I’m glad for the respect that Dojo and Prototype has garnered for JavaScript, but in the end, I think most practical developers will find all of their most difficult support issues alleviated by jQuery’s tidy access to the DOM. Anything else they want to do can be “code as you go” since jQuery keeps presentation code from gumming up the readability of your programming logic.

  30. Brad Brad said on August 25th

    P.S. Photoshop is a great allegory for Prototype. The darn thing takes 10 minutes to load and psd files are notoriously byzantine. Every new version of Photoshop brings more and more but I feel that in the end it gets less and less practical. I now use Fireworks 95% of the time and use PhotoShop only for fine photo touch-up. I think Adobe understands this since they will be retaining FireWorks and dumping the Photoshop-spawn ImageReady. Not sure what that might imply for the Prototype allegory.

  31. Michael Geary Michael Geary said on August 25th

    I apologize for attributing that post to John Resig – as Nate pointed out, it was written by a third party. But it was posted on the official JQuery blog, so I’m assuming it carries the endorsement of the JQuery project in general.

    Bad assumption. The jQuery blog (note: not JQuery) aggregates posts from a number of jQuery users. This post was the author’s opinion and doesn’t carry any kind of “endorsement” from other jQuery users and developers.

  32. Gilles Gilles said on August 25th

    sidenote: Firebug gives me about 71 prototype errors on this page :)

    Other than that, i agree that the only thing that switched me to prototype was (at first) the filesize. However, since more and more people are starting to “use” jquery and write plugins for them, it is really easy to extend. I totally agree that it is based upon prototype, and a lot of plugins are based upon scriptaculous, but that is because we all come from that, and we all loved that :)

    Off course, this is.. speaking for myself…

  33. Marc Marc said on August 25th

    It is not about Sam not responding to Blog posts, I could not care less.

    Trac has trivial patches for Prototype lingering for months. I can count his comments on bugs posted in Trac using one hand. I have NEVER seen a single post to the mailing list, he does not answer to emails.

    If you want to contribute, you do not know what will be accepted at all, if it fits the direction Prototype is heading, how it should be structured, criteria to integrate it, etc. Contributing to Prototype (patches, new functionality / objects, helping in Trac) is a waste of time as it is, I have given up on it, it is not rewarding. Scriptaculous is a different thing. Thomas is a great maintainer.

    But by any other measures, Prototype is abandon-ware, Sam is a miserable failure as a maintainer.

    If DHH wants to see more documentation for Prototype, he should put someone in charge to actively coordinate it and really do something with the contributions. Otherwise it will be a major failure, turing away people in disappointment.

    Say whatever you like about Alex Russell or John Reisig, but they encourage contribution.

  34. Mario Mario said on August 26th

    I found a lot of usefull doc links at http://www.prototypedoc.com/

  35. Dustin Diaz Dustin Diaz said on August 26th

    @Nate Cavanaugh: I will have nothing to do with your balls.

    @Palmer: I love what you’ve had to say here. All in all, I think the best philosophy is the one that works for you. I couldn’t stress this enough in any tutorial that I write. Hey, if anyone has it right, it’s Keith – Learn JavaScript

    YUI’s philosophy is to not muck with the language as one of its main goals is to fix what’s broken, normalize browser differences, and then add in the sexy features. I find it quite ironic that despite what folks say about the namespaces, YUI can tout being one of the smallest in file size when broken down into independent utils.

    Beyond even that however, I think Prototype does the best job of maintaining what the public wants. Function naming and readability seem to be somewhere between jQuery and YUI – and as a matter of fact, minus the ‘YAHOO.util’ – YUI and Prototype seem to be doing pretty much the same thing. Eg: Prototype (Element, Event, Position) : YUI (Dom, Event, Anim). (FYI, I say “pretty much” very relaxed).

    All things aside, I too wish that the politics were taken out of it. There is in fact such thing as friendly competition, but articles like these have nothing to add when the only cons they can say about YUI is “lack of larger widgets like an ‘editor or a live table’” (wtf does that mean?) or how Prototype doesn’t have package management. Bleh.

  36. Arrix Arrix said on August 27th

    I like both Prototype and JQuery. JQuery has a more active community while Prototype is rather quiet. The most recent change of Prototype was committed 4 months ago. Sam is not a vocal character indeed but I want to see Prototype keep improving.

  37. Simon Jia Simon Jia said on August 27th

    I’ve tried jQuery and Prototype. Well, i have to say, neither of them is perfect. Actually, none of the libraries out there are perfect. The major difference of jQuery and Prototype as far as I can tell is that you do write less code with jQuery , but jQuery does suck on cross browser and is still buggy as hell. Another thing is the plugin. I don’t really agree on judging upon the plugin for both libs. It is your choice of writing your own plugin and your choice of how well organized codes your plugin is. You can use Protoype and still write ugly codes. Another thing, i’m not really a big fan of books. Reading “Ajax in Action” the 3000 pages was enough for me for the next couple years. I’m the kinda guy who likes to read documentations online and the fact is neither of the libs provide sufficient enough of documentation. jQuery for instance, there are lots of good functions that are not documented (speed, animate, etc.), and as for Prototype, well you know how crapy the documentation is.

  38. Yehuda Katz Yehuda Katz said on August 27th

    Hey Simon,

    Check out the new jQuery Visual Documentation at: http://screencasts.visualjquery.com/visual/docs.xml

    It’s a fairly complete documentation package for the recently released jQuery 1.0, generated from the inline documentation John has so kindly inserted into the source code.

  39. Dave Dave said on August 27th

    The menu on the jQuery Visual Documentation site does not do anything for me, just throws an error:

    Error:
name: ReferenceError
message: Statement on line 34: Reference to undefined variable: $
Backtrace:
  Line 34 of inline#2 script in http://screencasts.visualjquery.com/visual/docs.xml
    $((function ()
{
  resizeHeader();
  $("#content, #header img").center("horizontal");
  $(window).resize((function ()
{
  resizeHeader();
  $("#header img, #content").center("horizontal");
}
));
  $("a").click((function ()
{
  node = this.parentNode;
  next = $(node).next();
  if ($.browser.msie)
    {
      $("li.list", node.parentNode).hide();
      $("li.text", node.parentNode).hide();
    }
  else
    {
      $("> li.list", node.parentNode).hide();
      $("> li.text", node.parentNode).hide();
    }
  $(node).siblings().removeClass("selected");
  $(node).addClass("selected");
  if (next.is(".text"))
    {
      next.corner();
    }
  next.css("display", "inline");
  return false;
}
));
}
));

    This is from Opera 9.

  40. Simon Jia Simon Jia said on August 27th

    Thanks Yehuda Katz for the link. And, Dave, you’ve just proved one of my point in my previous post, jQuery isn’t that well designed for cross browser. At the meantime, the newer release of the jQuery (the one that’s in the SVN, http://proj.jquery.com) seems to have fixed some of the bugs. One thing that i’ve noticed is that jQuery has memory leaks when applying events to large amount of DOM Objects. For instance, if you are trying to do a drag and drop or simply a large onmouse menu system, the memory leak problem is very obvious. But, one thing I love about jQuery is the power of the $() function. This is one thing Prototype is lacking on. The DOM Traverse from jQuery makes coding so much easier. You can drill down on the DOM structure by just giving a tag name with its class name, or even a input that has the type of file. Now imagine we do that in Prototype. I often find myself in the situation of class and id every single node that i need to apply some events to when using Prototype. Back to the main topic. jQuery and Prototype are both great if you are not doing anything too complex. But i do agree that the article is misleading in some ways.

  41. Tobie Langel Tobie Langel said on August 27th

    Simon: try Prototype’s $$() function. It’s quite similar to JQuery’s $() function (i.e. you can pass it CSS selectors).

  42. Lindsey Simon Lindsey Simon said on August 27th

    I’m glad prototype doesn’t come with a ton of baggage, and what would most likely end up being, useless components. I don’t want the kitchen sink for my text editor, my desktop, or my framework anymore. I do want to be able to interoperate.

  43. Yehuda Katz Yehuda Katz said on August 27th

    I’ve tested Visual jQuery on Opera 9. It works on my Windows machine without any glitches.

    What platform are you running on, Dave?

  44. Andrea Martines Andrea Martines said on August 28th

    What’s driving me mad about Prototype is the total lack of any type or roadmap for the upcoming versions. This is not a matter of being a verbose mantainer: a simple list of what’s cooking in would do the job. But we haven’t this list. I’m actually considering a complete refactoring of a web app (built on Prototype) I’ve developed in the last months, and the fact I really don’t know if my needs are going to be addressed (about inheritance, events handling and so on) are forcing me to evaluate other pieces of code (e.g. the YUI Event Utility) and a list of Protoype hacks. Or even spend a considerable effort on building an abstraction layer for an effective library switching (that would obviously affects performance). The point is: this situation is pushing developers out of Prototype, while it would be so easy to keep them engaged with this otherwise great library!

    @Simon & Tobie: $$() in Prototype is still ugly in performance, if your apps are intensively dom querying and you need a very responsive interface. Though I haven’t yet compared it with jQuery, my tests show the best choice is still the good ole Willison’s getElementsBySelector script.

  45. Brian Miller Brian Miller said on August 28th

    OK, Everybody. Quit beefing about how nobody updates/improves Prototype, and just fork it already. Somebody found “Opentype” or something, set up a SF site, and create a real community effort.

    You can even bake in a philosophy that enables it to hot-swap out for regular Prototype, so all you have to do is include it in your web page, and it’ll work just fine with Rails.

    Personally, I’d rather just stick with jQuery. I’m surprised that no one’s mentioned this about jQuery yet in this discussion – it doesn’t add anything to Object.prototype, and keeps the global namespace clean. That Prototype doesn’t has always been my biggest issue with it.

  46. Dave Dave said on August 28th

    Yehuda, I use Opera on a Mac. I wonder if this shouldn’t make a difference, Opera or Firrefox should behave the same regardless the platform.

  47. Dave Dave said on August 28th

    Brian, Prototype does not add anything to Object.prototype anymore, this is why noone mentioned it.

    And Prototype is indeed mostly for an environment where you control everything. Ads or other external content which brings its own JS could clatch, mostly when trhe external code is not clean (for in loop over arrays mostly).

    If you are concerned about containment, jQuery or dojo is the better option.

    About forking: There has been talk about it. Forking is a dirty, problematic option, dividing the users, splitting forces, most likely producing incompatibilities for future versions, etc. But it already happens on an individual level. Many developers have their own hacked up version.

    The situation with Prototype is fucked up, no doubt about that :-(

  48. Lindsey Simon Lindsey Simon said on August 28th

    @Andrea: I think you’ve very eloquently expressed a bummer feeling many other prototype-loving developers have felt as well.

  49. Tobie Tobie said on August 28th

    Andrea Martines: there exists an optimized version of $$().

  50. Ruby on Rails Ruby on Rails said on August 28th

    I was also surprised that nothing was mentioned of prototype. There’s definetely quite a few libraries, so this article certainly clears some things up.

  51. Scott Superb Scott Superb said on August 28th

    I am a die hard prototype fan. Not sure exactly why, I guess it’s just been easy for me to grasp. However I have slowly begun to loose the faith with YUI and JQuery both boasting better documentation, tutorials and file size!

    One of the biggest things keeping me from easily transfering is the fact Rails loves prototype and makes alot of things easier.

    I personally would be thrilled if more people were able to contribute to prototype. There also needs to be a centralised kick ass documentation for prototype. Is the script.aculo.us wiki the official spot for prototype documentation?

  52. Andrea Martines Andrea Martines said on August 28th

    @Tobie: Yes, I know the optimized version of $$(), which is stil some factor lower than Willison’s function.
    I’ve managed Sylvain’s test to cover getElementsBySelector() and cssQuery, too. Take a look at the extended test.

  53. Tobie Langel Tobie Langel said on August 29th

    Andrea, thanks for the test. They are enlightening. Have you tested jQuery’s $() by any chance?

  54. Brian Miller Brian Miller said on August 29th

    Anecdotally, I can tell you that there’s a lot of “optimization-where-possible” involved in jQuery’s central selector function. The amount of time it takes to run varies wildly based on what you ask for, and how. Trial and error, along with an old-school sense of “terse is better” will help.

    If you test it, you probably want to use several different selector patterns. In some cases, jQuery will perform at least as well as the improved $$() or Williston’s getElementsBySelector(), and in some cases, it probably won’t. But, what makes jQuery special is that it can handle vastly more selector patterns than anything else, including some unique extensions. e.g.: $( ”#myreflist tr.mycategory td.linkcolumn a:first” ) should give you the first link in a specific column from a subset of rows. That will probably take a long time to do, but jQuery is probably the only library that can do it in one line. Faster would be to put id attributes in your table rows, and reference the one you want.

  55. Simon Jia Simon Jia said on August 29th

    @Andrea Thanks for the test. Could you possiblly add the jQuery’s $() on this test also? This has convinced me even more not to use prototype at least for now.

  56. Simon Jia Simon Jia said on August 29th

    right now i’m using jQuery to generate a menu system. The menu is constructed in uls and lis. The problem i’m facing is that on the very same page, there’s also the drag drop sort functions on a seperate section of the page. What i’ve noticed is huge amount of memory leak. The menu system i wrote was only 20 lines of codes, but i guess the $() function in jQuery that drills down on the DOM is killing it.

  57. Cory Hudson Cory Hudson said on August 29th

    There really does need to be some documentation for Prototype. I am in the process of writing some myself. I started going through the parts of the library that aren’t as documented and playing around, and found some really cool string methods. I’ve put up an article detailing these:

    Using Prototype’s New String Functions

    Excuse the mess, this is my first blog and post.

  58. Simon Jia Simon Jia said on August 30th

    @Cory Good luck on keep digging up the lib. The whole point of using another framework is to make coding simpler not over complicating stuff. If I have to go in and dig up all the functions myself, i will better off writing my own framework.

  59. Brian Miller Brian Miller said on August 31st

    @Simon: Can you forward the code that leaks to John Resig or Yehuda Katz? (Or, perhaps, post it here?) I’m sure that it will be fixed quickly if it can be, and added to Subversion.

  60. Simon Jia Simon Jia said on August 31st

    @Brian: nvm the memory leak, part of it was my own fault. I just figured it out. I had a loop that was run everytime it drills down one level of the menu. The other thing that i couldn’t figure out is the drag and drop lib. It is either a memory leak or memory over usage. http://interface.eyecon.ro/demos When i have over 40 items that need to be drag drop sortable, it gets really slow.

  61. Nate Cavanaugh Nate Cavanaugh said on September 7th

    Um, in response to Brad’s comment about Photoshop up there, I think it betrays your ignorance (or lack of skill) when it comes to Photoshop.

    Anyone that prefers Fireworks over Photoshop obviously doesn’t know either one.

    Not to hijack this thread, but it’s only to maintain the comparison.

    Photoshop is the best, most powerful editor bar none, and Prototype is the best JS library, bar none.

    And it really is pointless to argue that fact because it’s like arguing gravity. It’s just sad to see people try to fight against realities.

  62. Nate Cavanaugh Nate Cavanaugh said on September 7th

    And yes, that was meant to be over the top and obnoxiously arrogant :)

Sorry, comments are closed for this article.