Popular AJAX Libraries

What are your favorites?

[cabbagehead]

So far I've just been using prototype.js and I feel its sufficient for everything I've wanted to do. People tell me there are other high level libraries out there worth considering too though.

What are your favorites?

[Greven]

I also use prototype.js, and love it(once if figured out that you need to call onException :))

[mehh]

I use a home brew and love it to bits. Its fits perfectly into my coding style unsuprisingly.

[yannis]

I started using jQuery.js. It is a fairly new library. I like its compactness.

[dungareez]

I am using protype and scriptalicious. As a newbie I find the size of it a little much for what I actually use of it. I love the shorthand of using just the $ for getElementByID, the form serialization, ajax functions, and a scriptalicious effect here and there, but honestly I have not used it for much more. Not sure that it would be worth the size cost except that I am making a project (heavy on ajax, php, and mysql) for an intranet for limited users so have great speed and great use of caching.

Honestly I find much of the functionality confusing as a newbie ( maybe I have finally grown a touch beyond newbie ;) )

Just something for newbies to ponder, make sure you are going to use it sufficiently to warrant the cost in size.

[distorto]

what is the "cost" of using prototype or scriptaculous?
I use both libraries mentioned above. Just curious what cost we are paying for linking those two js files to a project. I haven't noticed any yet.

[Fotiman]

I highly recommend the Yahoo UI Library [developer.yahoo.com]. But it is a little different from some of the other libraries. It requires slightly more more development on your part than, say, scriptaculous or prototype, but it's much more flexible. It's also very well documented.

My favorite components of the library are the Event and Dom utilities. Makes event handling so easy. For example, you can do things like this:

YAHOO.util.Event.on(window, 'load', function() { 
 // All your window onload methods go here 
 // For example, attaching an onclick handler to a link 
 YAHOO.util.Event.on('someLink', 'click', function(e) { 
 YAHOO.util.Event.stopEvent(e); 
 alert('You clicked on a link to ' + this.href + ', but I'm stopping you'); 
 }); 
}); 

There's so much that can be done with this library, including adding animations or other cool effects.

Yes, it does add weight to the page. But the library includes minified versions of the files where all of the extra whitespace and comments have been stripped out, and if you can serve them up GZIPPED, then it's even smaller. They also let you serve the files directly from the Yahoo servers if you want (so if someone has visited some other site that included those files from the Yahoo server, they will already be cached in the browser). Or you could install them locally.

Great library.

[Fotiman]

One more thing about the Yahoo Library... you can also setup shortcuts similar to the prototype's $ method. For example:

$ = YAHOO.util.Dom.get;
var x = $('foo');

[distorto]

wow...I'll check that out.

[Fotiman]

what is the "cost" of using prototype or scriptaculous?

As with any library, the "cost" in most cases is purely the size of the script(s) being downloaded. Also, each extra script file means another HTTP request to the server (you want to keep HTTP requests as low as possible)