Script Perfect

         Random snips of code and bugs

JQuery UI vs. Scriptaculous

Posted by Tim On September - 10 - 2009

scriptaculous vs jquery uiDoll up your website with great effects and widgets by using JQuery UI or Script.aculo.us. It is becoming easier and easier these days to impliment all sorts of effects to your site with just a few lines of code.  One question many people have is which one of these interfaces reigns supreme over the other? The answer is not really that simple considering how many different flavors of designers, code monkeys, and developers there are today.

There has always been a huge argument over the file size when using any plugin… “In the left corner weighing in at 450.5KB is JQuery UI! In the right corner weighing in at 621KB is Scriptaculous!”. It does not seem like that big of a difference, I mean we are only talking about 17oKB difference between the two.  If we were to minimize both of these files and enable file compression on our servers I doubt you could even notice a difference on a good 56KB modem connection. So what are the benefits of using one over another?

Round 1: Effects

Visual appeal is almost as vital as functionality these days. Even if your site functions better than most you still need the eye candy to attract and retain visitors. These two APIs go head to head when it comes to styling your page.

Effect JQuery UI Scriptaculous
Appear YES
Blind YES YES
Bounce YES
Drop YES YES
Explode YES
Fade YES
Fold YES YES
Grow YES
Highlight YES YES
Morph YES
Move YES
Opacity YES
Effect JQuery UI Scriptaculous
Parallel YES
Puff YES YES
Pulsate YES YES
Scale YES YES
ScrollTo YES
Shake YES YES
Shrink YES
Slide YES YES
Squish YES
Transfer YES
Tween YES

Scriptaculous wins round 1 hands down with the most available effects.

Round 2: Implimentation

We will compare how a few of the similar effects are called as well as additional functionality such as parametrization.
Effect Call: JQuery UI

$("#effect").show(selectedEffect,options,500,callback);

Effect Call: Scriptaculous

Effect.selectedEffect(‘id_of_element’, { options });

The call to run the effect is very similar on both of these API’s. The code required to call an effect is also similar in length. Let’s take a look at the options available when running an effect.
Effect Blind Options: JQuery UI

Speed : Speed of the effect
Callback: Something to execute after the effect

Effect Blind Options: Scriptaculous

scaleX, scaleY, scaleContent, scaleFromCenter, scaleMode, scaleFrom, scaleTo: All scaling options
duration: Length of effect

On one hand JQuery allows for a callback, in the other you can scale with Scriptaculous. This round comes down to user preference, if you are looking for more options for your chosen effect then Scriptaculous wins, if you are looking for callback functionality then JQuery UI wins.

The result of this round: Draw

Round 3: The Add Ons

JQuery UI has Widgets and Interactions, Scriptaculous has Behaviors and Controls. Contained within these two areas we have things such as: draggables, droppables, sortables, sliders, progress bars, Ajax controls, and more. Jquery UI has a great interface in which you can edit themes which will pump out the required code to implement, Scriptaculous does not have this. When we talk about Ajax controls Scriptaculous has several features available where the JQuery UI has none.

The overall comparison of the add ons is rather even and it comes down to what the user desires again. It would be great to have the functionality of both combined into one.

Result of this round: Draw

The Winner Is….

Overall I would call Scriptaculous the winner, I personally beleive it is far ahead of JQuery UI as far as options and effects. While both of these are great tools to use you still have to pick and choose the effects or features you want and the ones you can live without.

3,632 Responses to “JQuery UI vs. Scriptaculous”

  1. cipy says:

    filmy erotyczne…

    Cipki ochocze wyruchania bezplatnie….

  2. Sites we Like……

    [...] Every once in a while we choose blogs that we read. Listed below are the latest sites that we choose [...]……

  3. important links…

    Guys check out these important links…

  4. Digg…

    While checking out DIGG today I noticed this…

  5. far east national bank locations…

    [...]senior animal health officer and head of the emergency prevention system[...]…

  6. Hello readers,…

    Valuable information and excellent design you got here! I would like to thank you for sharing your thoughts and time into the stuff you post!! Thumbs up…

  7. sopapilla recipe…

    [...]Swedish therapeutic massage was designed utilizing tactics used by the Swedish physiologist as [...]…

  8. You should check this out…

    [...] Wonderful story, reckoned we could combine a few unrelated data, nevertheless really worth taking a look, whoa did one learn about Mid East has got more problerms as well [...]……

  9. ………..

    My partner and i suppose in the meantime i’ll be satisfied with book-marking as well as including your current Rss to my own Yahoo bank account. My partner and i look forward to brand new revisions and can talk about this specific blog using my Facebo…

  10. Gems form the internet…

    [...]very few websites that happen to be detailed below, from our point of view are undoubtedly well worth checking out[...]……

  11. excessive supply of estrogen? you will be…

    experiencing headaches, too much weight gain, nervousness, heart palpitations, irregular menstruation, depression and even digestive concerns. but these symptoms may signal low estrogen levels as well so it’s significant to have yourself checked often…

  12. pendidikan says:

    Hello,…

    I am also writing to make you understand what a really good discovery my friend’s girl developed reading your webblog. She mastered lots of things, not to mention how it is like to possess a very effective teaching heart to get many people easily lear…

  13. free website submisson…

    I found this really interesting post today…

  14. You should check this out…

    [...] Wonderful story, reckoned we could combine a few unrelated data, nevertheless really worth taking a look, whoa did one learn about Mid East has got more problerms as well [...]……

  15. Recent Blogroll Additions……

    [...]usually posts some very interesting stuff like this. If you’re new to this site[...]……

  16. Okna Poznan says:

    About thatarticle I read……

    …check that out – we’re linking to……

  17. Cool sites…

    [...]we came across a cool site that you might enjoy. Take a look if you want[...]……

  18. Check this out…

    [...] that is the end of this article. Here you’ll find some sites that we think you’ll appreciate, just click the links over[...]……

  19. The best website……

    [...] Sites of interest we have a url to [...]…

  20. pet grooming says:

    Trackbacks…

    [...] I watched somebody chatting about this on Tumblr and so it tied up to [...]…

  21. Visitor suggestions…

    [...] may probably have used up the lack of this points motivated with the aid of your self on [...]…

  22. Cool webpage…

    [...] pursuing are a few links to online websites which I connect to because we do recognize these are worthy checking out [...]…

  23. Superb website…

    [...]always a big fan of linking to bloggers that I love but don’t get a lot of link love from[...]……

  24. Sources…

    [...]check below, are a handful of totally unrelated websites to ours, however, they are most reliable sources that we utilized[...]……

  25. Websites you should visit…

    [...]below you’ll find the link to some sites that we think you should visit[...]……

  26. silver brooch…

    [...]Here is an excellent Blog You might Uncover Fascinating that we Encourage You[...]…

  27. Recent Blogroll Additions……

    [...]usually posts some very interesting stuff like this. If you’re new to this site[...]……

  28. will smith blu ray…

    [...]actually listen to real specialists other than people more than compensated [...]…

  29. Deck Picture says:

    Deck Picture…

    [...]although internet sites we backlink to beneath are considerably not related to ours, we feel they’re actually worth a go through, so have a look[...]…

  30. Concrete House…

    [...]Wonderful story, reckoned we could combine a few unrelated data, nevertheless actually really worth taking a look, whoa did one find out about Mid East has got far more problerms as well [...]…

  31. Visitor recommendations…

    [...] we ran into a very good site that you might love. Check it out if you need to [...]…

  32. Here is something I found out today:…

    I recommend you check out this awesome article…

Leave a Reply

Spam protection by WP Captcha-Free

About Me

I am an independent web developer and webmaster of many sites. The main goal of Script Perfect is to provide answers to some of the hard to find questions when it comes to website design and coding.

Twitter