Pinterest Stumbleupon Whatsapp
Ads by Google

javascript code libraryYesterday, I wrote about what JavaScript is and how it works What is JavaScript and How Does It Work? [Technology Explained] What is JavaScript and How Does It Work? [Technology Explained] Read More . Building on the immense popularity of JavaScript these days on the web, a number of libraries have come up to the forefront.

So what exactly is a library and why would you want to use one for JavaScript when you can do just about anything without including another file in your code? Glad you asked. Let’s try and answer that, and also have a look at some of the top JavaScript code library options available out there.

Libraries

When talking in terms of programming and computers, libraries generally refer to collection of re-usable code that aids you in developing your code for a particular job. JavaScript libraries in particular, provide you with a host of useful utility functions that make development a lot easier. In addition, a JavaScript code library takes care of the cross-browser issues allowing you to focus on your application’s logic rather than resolving discrepancies amongst the various browsers. Here is a quick rundown of 5 most popular JavaScript Libraries:

jQuery

javascript code library

Arguably the most popular JavaScript code library out there. jQuery is called the “write less, do more” JavaScript library. One of the reasons for this is the concise syntax and one-liners that allow you to perform complex tasks, that would normally require a fair amount of code.

Ads by Google

$(‘#toc’).children(‘li’).addClass(‘highlight’).show(‘slow’)

This is a typical jQuery one-liner that looks for a DOM element with id "toc" and then traverses its children for any "li" elements, adds a class highlight to them and unhides them while animating them slowly. Try doing that in a single line of crude JavaScript!

Greatest strength of jQuery is DOM traversal and manipulation. These have been made so easy with jQuery that one often tends to slack off when writing markup, thinking how easy it is to manipulate it using jQuery. In addition, jQuery also has excellent list of plugins and jQuery UI which is great for extending the capabilities of jQuery and designing awesome user interfaces.

Moo Tools

javascript code library

Moo Tools offers similar capabilities as well. Both jQuery and Moo Tools offers similar capabilities and differ slightly in syntax. Moo Tools is slightly more inclined towards writing Object Oriented JavaScript. While nothing stops you from doing so with jQuery, Moo Tools actually facilitates writing re-usable Object Oriented Code. jQuery is focused more towards getting things done easily while, Moo Tools is for the intermediate to advanced JavaScript developer who wants to writes components to use them later.

Moo Tools has a plugin directory of its own, it may not be as rich as jQuery’s plugin directory but it is certainly one you can turn to when in need. The documentation is good and there are books that focus on Moo Tools so you can get started and be up to speed easily.

Dojo Toolkit

javascript libraries

As the name says, it is a toolkit. As such it offers a powerful API that lets you perform complex tasks like DOM manipulation, traversal and animation easily via CSS selectors as do most other JavaScript frameworks and libraries. Where Dojo excels is the performance front. Dojo along with jQuery are the two best libraries in terms of execution speeds (although at the end comparing JS frameworks in terms of speed is sometimes like comparing apples to oranges).

Dojo Toolkit also offers rich UI widgets that you can use to enhance the user interface of your application. Dojo supports all the popular browsers and the documentation is good along with a number of books that you can buy to learn the ins and outs of Dojo Toolkit.

Ext JS

If it is the user interface you are focusing on, when developing your web app, Ext JS is perhaps one of the best solutions out there. Ext JS provides a comprehensive set of widgets which give your web app a desktop application like look and feel. The UI widgets are rich in functionality as well, capable of fetching data via a variety of methods and displaying them exactly like you want.

There are tabs panels, trees, accordions, grids and a whole lot more. These can be combined with one another by means of layouts (a la Java Swings) to design a complex layout that can put desktop applications to shame. You can look at some of the demo apps over at Ext JS site to see what the javascript code library is capable of. Recently they have also released the Ext Designer, which allows you to create UI’s using simple drag-and-drop operations and then gives you the code for UI.

YUI

javascript libraries

YUI or the Yahoo! User Interface library is the same library that powers the Yahoo! homepage. YUI is a robust, feature rich JavaScript Library developed by engineers at Yahoo and now includes code from contributors from around the world.

The library features number of UI widgets, utilities to take care of animation, drag and drop, AJAX calls and the likes. Contrary to other popular libraries, YUI actually lets you choose just the features you want to use, which keeps your application lightweight. You can find a lot of examples and tutorials, along with excellent documentation to help you along.

There a host of other JavaScript libraries that didn’t find a mention above. Prototype, Scriptaculous, Mochikit, Qooxdoo, Open Rico to mention a few. All the libraries bring something extra to the table. There has never been nor there will ever be a clear winner. The one you choose is the one you are most comfortable with and the one that suits the needs of what you are trying to build.

  1. JavaScript Media Player
    July 25, 2010 at 7:38 am

    very cool & good js frameworks, thank you very much for sharing.

  2. yuregininsesi
    June 27, 2010 at 1:37 pm

    It's be really great if you wrote like a beginners tutorial for jQue

  3. GeekLad
    June 20, 2010 at 2:08 am

    I like jQuery myself. Good roundup Varun.

  4. Excavator12
    June 19, 2010 at 5:50 am

    Thanks for that...I've been working on developing a few sites and have wanted to implement more javascript, but wasn't really sure of the differences between the libraries...this helped clear up things a little. What I'm still having some trouble with is finding the best way to implement it. I'd like to use the google javascript library, but don't know much about it.

  5. Amaan
    June 14, 2010 at 4:35 pm

    It's be really great if you wrote like a beginners tutorial for jQuery.

Leave a Reply

Your email address will not be published. Required fields are marked *