Why YUI is my favorite Javascript framework and why it should be yours too!
Filed under: programming
Number of comments: 
Number of trackbacks: 
Tagged with: I've been meaning to write this article for quite a long time. By now I can safely say I have extensive experience with various different Javascript frameworks and I can therefore now express my preference. Now before I get started the following: You may think I'm heavily biased because I happen to work for Yahoo! when it comes to my preference for YUI. In a certain sense this is true, but not in the sense most people will think.
The only influence my job at Yahoo has had on all this is the simple fact that working there exposed me to how great YUI really is. This is something that a lot of you may not realise yet, for the simple reason that you've never REALLY looked at it. When looking around on the web for Javascript frameworks it never seemed to be the popular option. I don't have any numbers to back up this claim but for some reason I haven't seen all that many tutorial sites, open source projects using it or blogs writing about it when compared to JQuery, Prototype.js or even Dojo. In short: Yahoo made me get to know YUI and fall in love with it.
Picking a framework to build Dark Matter
Since april 2008 I'm working on a fairly advanced photoblog template: Dark Matter. It provides a quite impressive amount of interactive functionality such as UI animations, AJAX commenting, a custom caching image browser carousel and much more. Before I started building this I had to choose which Javascript framework to base all this functionality on. Needless to say, I choose to use YUI. As you may know from the articles I wrote about it I quite like JQuery as well. JQuery is extremely easy to use, very widespread and has lots of community support as well as fans blogging about it. I love using JQuery for small bits of functionality and most important for fast prototyping of Javascript based functionality. For a long-term project with more complexity however, my vote goes to YUI.
So what's so great about YUI?
Let me explain a few reasons why I believe YUI is the framework of choice.
Debugging and Profiling
YUI offers extremely advanced and sophisticated debugging through the YUI logger control. There is no other Javascript framework offering tools that are this great while developing an application. Especially in IE where you cannot use Firebug this has proven to be extremely helpful.
Want to improve performance by finding bottlenecks in your code? YUI provides an excellent profiler.
Blistering fast framework hosting and serving of assets
YUI can be served from Yahoo's own CDN. There is pretty much nothing faster than this. Your hosting provider can't possibly beat the speed at which these files are served and in addition to that, because the files are hosted on another domain than your own you get some free extra parallel asset downloads!
Then there's the YUI loader. YUI loader allows loading of YUI component as they are needed. This means they will only be loaded when they're actually used. This further speeds up your site and prevents loading of unnecessary code on pages that don't use it.
While certain other JS libraries are now also served from a CDN thanks to Google, for YUI not just the core libraries are hosted on Yahoo's CDN but all widgets as well! So whatever component you want to use, speedy hosting is always available!
Excellent documentation
YUI is well supported and comes with a vast amount of examples and API documentation. For just about anything you need you'll be able to find a documented real-world example in the YUI examples section. The API documentation section is equally brilliant. It's all there, waiting for you to discover.
Web Standards and REAL Javascript
Now here comes the most important reason I love YUI.
Like I said before, I quite like JQuery for rapid prototyping and small things such as an accordion menu. It's pretty damn amazing how much you can do in JQuery with very few lines of code. As great this may be, I think this is also where it's core weakness lies. JQuery is almost a new language of it's own. It's very well possible to use JQuery to a fair extent without really understanding the language Javascript. This can of course lead to horrible code where a gazillion things are chained together resulting in unreadable code consuming vast amounts of memory. Not so much with YUI! While YUI offers me everything I need to get things done, it doesn't attempt to change the language or force me into patterns that don't look much like Javascript anymore. Maybe some will see this as a potential 'weakness' in YUI: One must actually understand Javascript in order to use it effectively. This may not be the way of the lazyweb but... it's worth it! The learning curve may be a bit steeper than with other frameworks but ... you will see an amazing return of investment!
Another great thing about YUI (at least, the core framework components) is the fact that it honours web standards in every possible way. It's born to do unobtrusive Javascript unlike some other frameworks that add all sorts of (horribly invalid) cruft to your markup. Yes, I'm looking at you, Dojo!
Using YUI made me understand much more about Javascript than I did before I was using it. It made me a much better programmer and come to the point where I can pretty much achieve anything I want in Javascript including writing custom widgets from scratch. It allows me to write highly maintainable code which is a joy to look back at without any 'WTF?' moments when looking at things I have done quite a while ago.
So, if you've never taken a closer look at YUI, I hope you now know what you're missing out on!
Now go check it out!.
At 09 July '08 - 17:50 Elliott Back wrote:
At 10 July '08 - 00:29 Marco wrote:
As I said before, I like JQuery as well. Quite a lot actually. Not however for larger tasks. I explained why as well. What do you think about the maintainability / real Javascript vs. JQuery-speak issue I raised?
At 10 July '08 - 02:42 Marco wrote:
Please keep the discussion below this post about Javascript frameworks after this and comment on Dark Matter here
Thanks!
At 10 July '08 - 09:10 Rey Bango wrote:
In addition, chaining is not a requirement of doing development using jQuery. Again, it’s a convenience thing and is something that’s used in almost all of the popular libraries including Prototype, MooTools and Ext.
With companies such as Google, Amazon, the BBC and Digg effectively using jQuery daily, we would know if maintainability was an issue and would’ve dealt with it some time ago. To date, the jQuery team has not received complaints about this even as the adoption rate of the jQuery library continues to grow consistently.
Rey
jQuery Project
At 10 July '08 - 09:20 Dylan Schiemann wrote:
Most of your reasons for using YUI over Dojo or jQuery or any other toolkit, are, in my opinion, based on you working with people that know YUI, and not based on the true merits of one toolkit over another.
At 10 July '08 - 09:54 Marco wrote:
About Dojo: I have yet to find the first example of Dojo in action that validates and degrades gracefully (e.g.: works without JS enabled). Can you show me some?
JQuery seems to do a lot better in this department. Like I said before, I quite like JQuery. Heck, this weblog is completely JQuery powered!. You can check it out for yourself if you wish.
What I don’t like so much is the ‘new sub-language’ that it results into. I’m also not a great fan of how exceptionally forgiving JQuery can be. It’s easy to write code that doesn’t throw errors but yet doesn’t do what you were trying to achieve.
Personal preference definitely DOES play a role in this post’s conclusion, which is why I tried to not speak in absolute terms and make sure that I’m speaking from my own experience over the past few years.
At 10 July '08 - 11:01 Dylan Schiemann wrote:
As far as example that validates, the contact form on the SitePen web site is a simple example that validates (well, I would technically need to remove an attribute from the script tag, but I digress) and degrades gracefully. http://sitepen.com/contact/
At 10 July '08 - 12:20 Marco wrote:
At 17 May '09 - 08:24 Nick S wrote:
At 14 June '09 - 21:34 Angel wrote:
so you’re a better programmer because of yui, eh? i never thought i’d hear a “good” programmer being “happy” about writing more code instead of less
At 02 September '09 - 22:12 AWK wrote:
jQuery provides many ways of doing things that are convenient. You have to learn it and follow it to gain the benefits it provides (some of which you can’t get with YUI). As with any framework, if you don’t learn and follow it’s way of doing things, then you’ll miss out a lot on the benefits. I think YUI is more like a set of tools than a framework and that is the point the author was trying to make.
Also, I’d like to mention, if writing less lines of code made good happy programmers, then we’d all be writing Perl (ugh). Sometimes sacrificing a little brevity for readability may be a good thing
At 03 September '09 - 23:35 jhuni wrote:
On this note, I don’t know if I like YUI 3.0 anymore because YAHOO 2.0 is already great, and they seem to merely be getting rid of things that I know and love about the library, and they are basically copying JQuery and Dojo, by forcing you to use a library loader and making everything unreadable chains like in JQuery. I don’t think copying other libraries is what is going to make YUI great.
At 16 December '09 - 14:10 Calvin wrote:
Thank you for writing this post and I hope I can help add to the list of sites that write YUI tutorials at http://www.calvinbushor.com..