That being said, it really boggles the mind (or, at least my mind) that YUI requires so much more complexity than jQuery does. I mean, sure, YUI has neat features like data tables. (I am sure jQuery does too, but I have not found it just yet.) However, it seems to be a struggle to even perform basic functions in YUI.
Inexperience? Maybe. Frustrating? Oh yes. This has actually been bothering me since I started learning YUI.
For example, take a look at DOM selectors in both. In jQuery, you can use the same syntax to select parts of the DOM by ID, class name, or tag. You can even nest all of these things easily. YUI definitely prefers all selection to be done by tag, though there are functions to get an array of elements by class name or tag, and nesting these things is not trivial.
As an exercise for a project at work, I created an example to illustrate my point regarding DOM selection between YUI and jQuery. The example is simple – all it does is replace the text in a paragraph tag when a link is clicked. The example DOM is minimal:
I implemented the solution in both jQuery and YUI.
Here is my jQuery implementation:
And here is my YUI implementation:
In both cases, I am grabbing the base libraries required for what I need to do here. YUI requires 3 server calls for 3 different library files, but the 1 library file for jQuery is almost twice as large than the sum of the YUI files. (The jQuery file is 24.1KB, whereas the sum of the 3 YUI files is 13.5KB.) So, I’m going to call that a wash.
However, my real issue with YUI is that I need to declare 3 variables and include an if statement to update this text, whereas with jQuery, I can accomplish the same task in 1 line. (I’m not counting the prevent default commands for either case here, since the 2 are basically equivalent.)
This has been my biggest pet peeve about YUI. Again, I am not sure if it is due to inexperience, but the more I look at the YUI documentation, the more I think it is not me.