The eternal question: jQuery or MooTools?
It’s been a while since my last post and even more since I first thought of writing a comparison post between MooTools, Prototype & jQuery. At that time (almost a year ago), I was a huge MooTools fan. Anyone who asked me “Hey I’m starting a new project, what javascript library should I use?” got the following answer: “MooTools, of course”. Nowadays, things have changed a bit and so has my vision on js frameworks.
Although my first intention was to compare Prototype, jQuery & MooTools, I’m going to only mention the last two in this post. Not that Prototype wouldn’t be a good choice, but because I have much more experience with the other two – and also because I’m not a big “fan” of Prototype. Anyway, besides these libraries, there are at least a dozen other full javascript frameworks that you could use, so in case this is your first time you hear of such things (hmm, I doubt it though), you should check out a few of them – Ext JS, YUI, dojo, MochiKit are some of the ones I checked, heard or used.
Back to our js “battle” – I believe I’m not the only one who had to decide which one to use. So, what did I choose? Both! Not in the same project, of course, but some of my projects use jQuery, some others are based on Moo Technology. You’ll probably say this is confusing and not helping you decide which one to use. First of all, I suggest you read this great article on jQuery vs MooTools – it was a great inspirational source for me and it also contains most of the language differences and basic approach. Then, let’s try and emphasis some of the key parts of using either of these two – I’m not going into code elements, you can check the manuals for that.
jQuery
– very simple to use, so if you’re a designer or don’t have enough experience in programming (or OOP), stick to jQuery
– only one method to access dom elements – $() or jQuery() – this is great because it removes a lot of extra code, so instead of writing something like $$(selectors).each(function(el) {el.do()}) (mootools style) you can just write $(selectors).do()
– cool effects are very simple to use and can be applied really quick
MooTools
– programatic approach, so if you’re a developer or an ex-programmer (and like OOP), this is for you
– two main methods for accessing dom elements – $() and $$() – again, the code is much more simple to understand when using $$(‘#id a.class’).each(), instead of the same $(‘#id a.class’) method as jQuery does. That’s why jQuery is simple, MooTools is “correct”
– the effects part of the library is very complex and allows a lot of chaining, grouping and transition effects. again, the only problem is that it takes a bit longer to write moo-code, than j-code.
Final Thoughts
I believe it’s clear enough what the main difference between jQuery and MooTools is: it’s HOW you write javascript code. No one can really tell jQuery is best, or MooTools rules – both of them are great libraries and both of them can come in handy if you know when to use them. From my own experience, I’d say if you have a small project, more design than development, use jQuery. If you have a more complex project, that involves more javascript code, maybe reusable elements, design patterns, classes, etc – use MooTools.
I remember that I didn’t like jQuery when I first got in touch with Moo, because it was very slow. I believe it sill is slower than Moo, but the difference is not that significant on small projects.
I think it’s best to know at least one js framework and stick to that, if it makes you more productive. But I also believe it’s only to your advantage to understand how others work.
Pseudo-disclaimer
Aaron Newton of Clientcide, the author of “jQuery vs MooTools”, added a disclaimer in his post, so I think it wouldn’t hurt to add one myself, otherwise I might get assaulted by un-happy prototype, extjs, dojo or yui developers 🙂 I’m currently using both MooTools and jQuery, and sometimes writing a few lines of code on Prototype. I don’t intend to promote either of these frameworks, it’s really up to you which one to choose. You could even write your own!
I’d be really glad to hear some of your thoughts on javascript libraries – which ones are you using and why, why you think a is better than b, etc.
Resources
http://www.jqueryvsmootools.com/
http://mootools.net/
http://jquery.com/
http://www.prototypejs.org/
I didn’t say jQuery’s way of doing it was incorrect. I said Mootools is “correct” (note the quotes btw), which doesn’t make the other one incorrect. What I meant was that Mootools extends getElementById and getElemenentsBySelector using one method for each ($ and $$), while jQuery only uses one (the second one), “suppressing” getElementById (again, note the quotes).
I know it’s trivial to make it respond to $$, and it’s also trivial to make it behave as Mootools, but out of the box they’re different, right?
And, again, you’re right – jQuery was supposed to handle it like that, which is not what I implied.
I feel you’re a bit upset that I said that because you’re a jQuery fan, but please do read the pseudo-disclaimer – I use both of them, I enjoy writing code using either of them, so this post was not for saying jQuery/Mootools is the best. It was meant as an simple, straight-forward objective comparison between the two most popular js frameworks/libraries.
Cheers!
This statement is very odd:
the code is much more simple to understand when using $$(’#id a.class’).each(), instead of the same $(’#id a.class’) method as jQuery does. That’s why jQuery is simple, MooTools is “correct”
* First, who said $$ is “correct”?
* Also it’s trivial to make jQuery respond to $$ instead of $
* jQuery was designed to handle it this way – how can that be “not correct”?
yes, i know, and i couldn’t say i’m totally happy with it. but, as far as I know, there are some ways of using jQuery or Mootools with Magento, instead of Prototype – if one really wants that 🙂
Nice overview. I personally prefer jQuery but Magento is using prototype -.-
Great summary of the Jscript vs Mootools article. While the long version gives you a very clear understanding of the differences it is too long winded.
This shorter version made it very clear that for the different projects it is unique.
I think the clear defining element is the plug-ins. This is the case with WordPress. WordPress is the best, IMHO, Blog/CMS just because of the community which support it and make the many many plug-ins. Because of this I think most of projects going forward will be JQ.
Dale
Web and eCommerces Developer
http://createmy.com.au