What are the best strategies for using multiple AJAX libraries?

Question

What experience can you share about using multiple AJAX libraries?

There are useful features in Prototype, some in jQuery, the Yahoo library, etc. Is it possible to include all libraries and use what you want from each, do they generally all play nicely together with name spaces, etc. For the sake of speed is there a practical limit to the size/number of libraries to include or is this negligible? Are there pairs that work particularly well together (e.g. Prototype/Scriptaculous) or pairs that don't?

Streptomycin

Answer 1

You could use all those libraries, but I highly recommend against it. Downloading and executing that much JavaScript will most likely choke the browser and slow down your user's experience. It would be much better from a user's perspective and a developer's to pick one. Less context/architecture switching and less code to maintain.

Like other answers have said, most don't conflict.

See Yahoo!'s Exceptional Performance site for more info.

Gillenwater

Answer 2

You could use Google AJAX Libraries API. It provides a common distribution network and a loading architecture for jQuery, prototype, script.aculo.us, MooTools and dojo

Margalit

Answer 3

YUI is pretty strongly namespaced so shouldn't clash with other libraries.

As mentioned you can run jQuery in no conflict mode.

Prototype does have some issues playing nice with other libraries in part because it (or it used to) modifies core Objects like Array. Protosafe attempts to address those issues.

Script.aculo.us is simply a widget library that sits on top of Prototype so those two should obviously play nicely together.

All of this means that you could use YUI, jQuery, Prototype & Script.aculo.us in your application, but you may find that using a single library makes it a lot easier to maintain things.

Welby

Answer 4

I'm a jQuery believer as well, so pardon my lack of knowledge about the others, but ...

What makes jQuery so great is the no-conflict mode, so for example, you would do:

$('#foobar').whatever();

With no-conflict mode, you'd do this:

var jq = jQuery.noConflict();
jq('#foobar').whatever();

One less thing to worry about. I'd imagine prototype offers a similar feature, and Yahoo as well.

But anyway, I'd don't want to advocate jQuery too much and make people mad, but whatever library you select, I think they all can do pretty much of everything you would need. Especially think about the benefits of not having to learn three different libraries.

All three should be capable. Select the one you like best and extend it. :)

Pathology

AFAIK Prototype doesn't have such feature. jQuery namespaces everything inside the "jQuery" object, and Prototype has its functions scattered over dozens of custom and built-in classes, so it would be very hard to do that. – Duvetyn

As for Yahoo, if I remember correctly it hides everything inside a namespace called "yahoo" or something, so it doesn't really conflict with anything by default. – Duvetyn

Answer 5

I'm using jQuery and the javascript file only version of the Microsof ajax tool kit side by side in project right now.

I think I'm going to go with jQuery and end up removing the Microsoft one. I'm very new to jQuery, but the more I learn about it, the more enamoured I get.

Biforate

Answer 6

The best strategy is to not use multiple libraries. It's tempting to want to throw more libraries at a problem, but it's inefficient, error prone, and makes your code harder to maintain by others.

In most cases you should be able to avoid using multiple libraries by understanding your problem domain and which library will help you best solve it. There is also a myriad of plugins and extensions for all of these libraries.

For example, JQuery supports cross-domain JSONP calls right out of the box and has a nice widget library in JQueryUI, Prototype does not.

$.getJSON('http://anothersite.com/mashup.json?callback=?', function(data) { });

Prototype has really good OO support and it's easy to traverse the DOM, but lacks some of the cross-domain functionality required to create widgets and mashups.

var Foo =  Class.create({  
  initialize: function(name) {
    this.name = name;
  }   
});

var Bar = Class.create(Foo, {
  initialize: function($super, name)  {
     $super(name);
   }
});

Mootools has great effects, good OO support, really solid widgets and cross domain request, but (and this might just be my impression), the development community isn't as collaborative and social with the global community (outside of mootools) as the other communities (Prototype used to be this way). This could be a result of their main developer(s) living outside the US, and thus are not able to attend as many conferences and participate in the greater community. I wouldn't let that deter you completely though, but it is something to keep in mind.

Suggs

Answer 7

Ruby on Rails uses both prototype and Scriptaculous by default, as there is little overlap between the two. I've also used yui snippets in addition to that and have never had a problem. Load times are an issue, but the libraries are usually cached, so it's only on the first page loaded.

Fdic

Scriptaculous is an ADDON to prototype. Which is why they work well together. – Pathology