Yahoo! User Interface (YUI) JS Libraries updates released

Some exciting news for front-end developers today: The Yahoo! Developer Network has released the newest version of it’s YUI JavaScript libraries today. With extensive documentation, great support for cross-browser coding, and a couple new components, these tools are becoming an even better solution for JavaScript developers. Check out more at the official YUI blog. Here is what’s new:

Updates to the previously beta versions of:

  1. An event utility
  2. DOM collection manager
  3. Connection manager (for AJAX / XHR calls to the server, now with file upload)
  4. Drag & Drop utility
  5. Animation Library (now includes color animation support!)

Additionally, the release of improves upon:

  1. AutoComplete
  2. Calendar
  3. Container (including Module, Overlay, Panel, Tooltip, Dialog, SimpleDialog)
  4. Menu
  5. Slider
  6. TreeView

And adds a new control: the Logger (beta).

What’s so great about these YUI Libraries? What about Prototype, Dojo, and Mochikit? As a former Prototype enthusiast before coming to Yahoo!, I noticed a couple things beneath the surface that I began to really appreciate when I made the switch:
  • I like knowing that a company of 12,000 people is backing, using, and continually supporting/improving my JavaScript library. They have a full time staff of people that are incredibly at handling all the annoying cross browser concerns and repetitive JavaScript tasks, so I don’t have to.
  • I have grown to love the heavily name-spaced nature of the YUI libraries. Sure, at first glance it may seem annoying to have to type YAHOO.util.Event.addListener, but it makes code highly independent and guarantees that it won’t interfere with other functions of the same name. One trick: add YUE = YAHOO.util.Event at the top of your page and you’re golden. I’ll admit, I do miss the $ function, but that can always been added individually.
  • The ability to extend the YUI classes is great. Say you need an extremely customized version of the Drag & Drop library. Easy, just take what they give you, and overwrite through inheritance in your own file the individual functions you need to modify.
  • Unlike Prototype (and others), there is not one massive JavaScript file.  Instead, if you only want Event Handling, you only include a small global yahoo.js, as well as event.js.  Then if you later want to add animation, you just include animation.js.  The point is, you only add what you need.

My absolutely favorite part of developing with the YUI libraries is getting to use these cheat sheets. Go print them now!

Follow @philfreo on Twitter

Comments are closed.