favorites?
Any other libraries you like?
I am narrowing in on jquery, but just wondering what else people like to use.
Jquery
I've used prototype quite a bit too, but jquery makes sense to me.
I think they're all pretty much the same and it comes down to personal choice.
Probably the most important thing is how well the library will be supported/maintained/enhanced in the future. I believe Dojo is the library that is integrated into the recent releases of Lotus Notes/Domino so that has IBM backing/support.
I've used prototype, jquery, dojo and yui and tend to use prototype as my first choice but that is because I am more familiar with it than the others. However, jquery seems to be the library of choice for being extended by the developer community.
Thanks for the input.
For giggles here is a comparison of the core selector capability of four libraries. I consider these four libraries the most serious contenders for enterprise development detached from the server (as opposed to gwt, rails, etc) This comparison evaluates core only - selector look up, style set and string injection. All were min builds.
All 4 library code examples were pretty close to:
var moo = $("demo"); moo.setStyle("backgroundColor", "#D00050"); moo.appendText("Hello Mootools!");
DOJO:

YUI:
*Getting accuracy and consistancy with YUI 3 was a challenge. You can see here I was unable to get rid of 304's even after a clear cache, but they are included in the kb totals.
jQuery:

MooTools

Each has advantages. jQuery and mootools haveloaded their sink, so they wont be needing much else unless you want to add a UI component from a 3rd party. Dojo and YUI however will be loading more modules as they go to compete with jQuery and MooTools, so you start to understand that they're already approaching size with jQuery and aren't even started in terms of loading their capability. It's a trade off. Shrug.
They're all pretty rockin and each will have its use case.
persist might be worth trying haXe you sort of don't really need frameworks you can use say neash for events and feffects for tweening and its like your still in flash and if you don't need much code in a project it can be much lighter than jquery, ofcourse I have only played but still, and I think some tools to help are coming out and I think there are some people using it seriously.http://mindless-labs.com/blog/archive/2009/10/27/JsUnHaXe_-_Javascript_cleanup_for_Haxe?utm_source=feedburner&utm_medium=feed&utm_campaign=Feed%3A+MindlessLabsDevBlog+%28Mindless+Labs+dev+blog%29&utm_content=Google+Reader
But I think its easy enough to create pretty much from scratch using haXe javascript what you might have to use a library for in javascript, at least thats the impression I get. As your fairly smart ( as in very ) I suspect you won't find it produces any slower code once the code gets complex, but will find it much cleaner to work with.
Hey persist,
want to post a fifth example using prototype? It loads the complete library and I'd be interested in seeing the comparison. For UI effects and the like it is extended using scriptaculous - you can either load individual effect libraries as required or the entire scriptaculous in one hit.
jQuery FTW. Just so many plugins and so much support.
Prototype.
This is not min build. Prototype leaves it up to you to min your build, probably to be sure the min build wasn't munged. I find that a little lame, and makes me think the project isn't fully supportive of min'ed and gzipped builds of their work. I googled quite a bit for a supported min build, although if you know of a native supported method (YUI seems to be the popular min method of choice), let me know and I will redo this. A little Googling shows you can min the build down to 93 kb.
With that 93-137 kb, prototype does buy you its oopy "class" class, which I like because you can remain completely within their paradigms without dropping into old fashioned js classes.
Performance was interesting. Although slightly larger, once fully loaded, the js was processed by the page slightly faster than its counter parts, which may be due to Prototypes sctrict adherence to proper [[prototype]] based classes in its source, a class structure sorely missing in some of the others. Using the prototype keyword is the supposed swiss method. Many projects use nested object notation - the supposed classical inheritance. "Classical" - A fancy name for crappy code. (open source community, please cut this out, ffs, read some docs on ecma 262).
:hammer: ALL WRONG!:http://www.phpied.com/3-ways-to-define-a-javascript-class/
Writing object inheritence to make it feel more like what you've been doing in other languages might seem ok and it works if you're careful, but it isn't right. Prototype chaining is how JS properly resolves object access and conserves ram through object sharing resolution in the scope chain. On many js frameworks, IMO ram usage is a huge concern being somewhat ignored.
RIGHT:http://kevlindev.com/tutorials/javascript/inheritance/index.htm
Same thing, hello world, selector, style, and injection.

I started out with Dojo but ditched it because it seemed like a sledgehammer to crack a nut. Switched to MooTools but got turned off by the snobbish attitude of the developers. I've been using jQueryfor 18 months or so and I'm pretty happy with it.
jquery
I wrote this pretty quickly with jquery just pokin around. I was amazed at the complexity overcome. This normally would have entailed copius ajax, and xml traversing. jquery makes it really easy for collaborative work by simplifying. I am really impressed with it so far.
It loads a rss 200 file from flickr and displays the pics in a table.
.pic { background-color: #666; height: 600px; width: 600px; text-align: center; vertical-align: middle; border: 1px solid #000; }
var max = 6;//has to be an even number
var html = "";
$.ajax({
url: "flickrrss.php",
cache: false,
success: function(rss){
var count = 0;
$('item', rss).each( function() {
var media = $(this).find('media\\:content').eq(0);
var url = media.attr("url");
var height = Number(media.attr("height"));
var width = Number(media.attr("width"));
var perc = 1;
//let's fit all the images into a bounding box.
if(height>width){
perc = 600/height;
}else{
perc = 600/width;
}
height = height*perc;
width = width*perc;
var imgTag = '<img src="'+url+'" height="'+height+'" width="'+width+'" />';
if(count % 2 == 0 || count == 0){
html+='<tr><td class = "pic">'+imgTag+'</td>';
}else{
html+='<td class = "pic">'+imgTag+'</td><tr>'
}
count++;
//let's load just a portion of the images
if(count == max){
return false;
}
});
jQuery('#boxtable').append(html);
}
});
I used a table to more easily vertical align cross browser with less CSS and overall KB than divs would have been.
I really like jquery
But then that's probably because it's super easy to use right off the bat. Not sure how well it scales when you're trying to get really crazy with it.
I've used jQuery for some pretty complex stuff, haven't had any problems so far.
var media = $(this).find('media\:content').eq(0);
this line is failing in many browsers. It seems most browsers don't like typed elements. I had to clean the rss in php before sending this off to jQuery.
Nice little test there persist, very interesting.
Personally I like MooTools, I've used them all and JQuery seems to have slipped into being the industry standard (Amongst Digital agencies), but personally I like the syntax for MooTools more.
IMHO YUI is too massive, I'm using it currently on a website I'm working on now, and I end up just using standard JavaScript when I can as it often works out faster.
YUI is more suited to full scale web apps I would suggest, things like Google Maps, not the stuff that people regularly work on with quick turn around.
This website gives a good breakdown of the differences between JQuery and Mootools, http://jqueryvsmootools.com/