Junal on the run

Comparing Scriptaculous, jQuery, mooTools and YUI!!

Posted on: October 16, 2007

I was thinking what should be the next JS framework/library for me to start after Scriptaculous? Well I started jQueary but suddenly I couldn’t continue after a while as I started using Prototype.js for my ongoing project. So I couldn’t know a lot about jQuery. I decided to find a next better JS framework in this Eid break. I guess I have found it! Telling you letter but first let me give you some ideas about these frameworks that I studied during this Eid break! First of all I read about mooTools(My Object Oriented javascript), because I was getting tired of reading all admiration about it from different forums. So I decided to study on it. A good thing about mooTools is you don’t have to download all libraries files from it. You can make your package lighter by choosing library files from the given list. If you want to use it all together yo have that option too. So lets find out some components of this framework.

  • Element
  • Window
  • Effect s
  • Drag
  • Remote
  • Plugins
  • Native

Example :

function say(msg){

alert($pick(msg, ‘no meessage supplied’));

}

Personally I think it’s not easy to use.

Now next one is YUI! (The Yahoo! User Interface)

 

YUI is the most complete and most namespaced library. But this one is very heavy , lets have a look at components.

  • Animation
  • Button
  • Autocomplete
  • Browser History manager
  • Color Picker
  • Container
  • DataSource
  • DataTable
  • Drag & Drop
  • Element
  • Event
  • TabView
  • TreeView

Any many more!

Example :

<div id=“test”></div>

<script>

var myAnim = new YAHOO.util.Anim(‘test’, {

width: { to: 400 }

}, 1, YAHOO.util.Easing.easeOut);

</script>

Ok, now come to Scriptaculous. Its cool but I don’t think it can be cooler. Although it is coming with some new features in their latest version 1.8 and 2.0 ! but still. Ok lets have a look at components:

  • Animation Framework
  • Drag & Drop
  • DOM utilities
  • Ajax Control
  • Unit Testing

You have a bonus for you if you use this JS library. It’s an add-on to the fantastic Prototype framework. Now prototype also has chaining [where you can call many functions on the same line] from 1.6 onwards

Example:

  <script type="text/javascript" language="javascript">    //
      <![CDATA[Effect.Appear('element_id');    // ]]> 
 </script>

Easier to use eh? Well, I guess this one is easier to use than others so far I mentioned.

Ok let me tell you I asked hasin bhai about these JS libraries. You know which one he said was best? ya answer is jQuery. Because it’s lighter, EASY TO USE and FAST! Let me give you an example from their official site.

$(“p.surprise”).addClass(“ohmy”).show(“slow”);

The above code snippet looks for all paragraphs that have a class of ‘surprise’, adds the class ‘ohmy’ to them, then slowly reveals them. Click the ‘Run’ button to see it in action!

Some components of jQuery :

  • jQuery Core
  • Selectors
  • Attributes
  • Traversing
  • Manipulation
  • CSS
  • Events
  • Effects
  • Ajax
  • Utilities

So Iguess you got your answer now. Well let me finish this post by telling you a funny thing. I was actually studying on this comparison since I started my Eid break. Was trying to be sure as much as i can. For that I asked Hasin bhai and Ahsan bhai. You know what happened with Ahsan bhai when i was asking him about all these libraries specially in his opinion which one was best so far?

Well read the bellow conversation…..my HEAD !!

Ahsan: but IMHO, JQuery is the best for the time being

Junal : IMHO? Haven’t heard the name ! same shit ?

Ahsan: in my humble opinion :p

Ahsan: hehehe

 Junal: lol:p

 

11 Responses to "Comparing Scriptaculous, jQuery, mooTools and YUI!!"

Interesting – I’m about to choose one myself at the moment. I decided that I wanted jQuery – and then I turned on strict checking of javascripts in Firefox and it showed up a lot of warnings – then I tested mootools – no warnings. I like jQuery – but if it isn’t coded the right way – well – that’s no good:/

Jquery is great, really great, but the UI components are so poor. Mootools has so much better drag&drop support, for example, as well as Scriptaculous, but this last one is so much heavy.

jQuery core is light on UI components, as those are offered all via plugins. There are some quite excellent ones out there, or, if you do not like any of jQuery plugins, you can always use ext right on top of it. (Of course, you can also use ext on top of YUI or prototype.)

Great observation, actually I’m going to make tabview but still confuse which should I pick is it jQuery or YUI. after read your post I think I will use jQuery for my tabview. Thxs🙂

what about Dojo?

i see that mootools have (usefull) chain system for recall function, so others framework have similar management?

thx for article🙂

I’m disappointed by this article. I didn’t see any real stuff much about their good and bad.
About mootools, you just listed its components then say, it’s not easy to use. I know that’s just what you think. If you give a peek into codes of these libraries, you’ll gain more understanding. How they orginaze their codes, which, I think is the first thing I’d like to consider when I get to develop my thing.
jQery – mature and helpful community
more plugins
mootools – better code organization
easy to use(you don’t need to bother Native, Remote and Plugins if you don’t want use them)
YUI – I don’t wanna mention it

As to speed, I don’t think there’s distinctive difference. What they actually do are more or less the same as well as the way how.

Using YUI at the moment. Maybe I should have a look at jquery. Thanks

well, this wasnt comparization at all, it was just – “there they are, features and some code”.. but no actual comparisation and all this was based off two people subjective humble options.

~ user of jQuery ~

the most argumentative topic you can find on Google nowadays :-8
and when i choosed mootools was because of its smooth animations shown at demo page and i’m fan of it so far. i know that JQuery is the most popular but why? mysterious !

hi, it also may be useful

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

View Junal Rahman's profile on LinkedIn
Subscribe to me on FriendFeed

Follow Me on Twitter

Archives

My photos

Downtown, Ottawa

Dream

Jasper, AB

Jasper, AB

Banff, AB

Folkfest, Bangladesh Pavilion Saskatoon

Lovely Sky

Stunt bikers on summer festival, Saskatoon

More Photos

Blog Stats

  • 420,271 hits
%d bloggers like this: