YUI 3.0.0: First GA Release of YUI’s Next-Generation Codeline
By Eric MiragliaSeptember 29th, 2009
YUI().use("node", function(Y) {
Y.one("#message").setContent("Hello, World!");
});
We’re pleased to announce today the general-availability release of YUI 3.0.0. YUI 3′s core infrastructure (YUI, Node and Event) and its utility suite (including Animation, IO, Drag & Drop and more) are all considered production-ready with today’s release.
YUI 3 is the first ground-up redesign of YUI since 2005, and it brings with it a host of modernizations:
- Selector-driven: YUI 3 is built around one of the lightest, fastest selector engines available, bringing the expressive power of the CSS selector specification into actions that target DOM nodes.
- Syntactically terse: Without polluting the global namespace, YUI 3 supports a more terse coding style in which more can be accomplished with less code.
- Self-completing: YUI 3′s light (6.2KB gzipped) seed file can serve as the starting point for any implementation. As long as this seed file is present on the page, you can load any module in the library on the fly. And all modules brought into the page via the built-in loader are done so via combo-handled, non-blocking HTTP requests. This makes loading the library safe, easy and fast.
- Sandboxed: YUI modules are bound to YUI instances when you
use()them; this protects you against changes that might happen later in the page’s lifecycle. (In other words, if someone blows away a module you’re using after you’ve created your YUI instance, your code won’t be affected.)
The code we’re shipping today in 3.0.0 is the same code that drives the new Yahoo! Home Page, and it goes out with confidence that it has been exercised vigorously and at scale. The team is thrilled to be sharing it with you today for the first time in a production-ready release.
Writing Your First YUI 3 App in 3 Easy Steps:
One of the goals of the YUI 3 redesign was to make it easy to use without sacrificing power, performance and configurability. You can have your first YUI 3 app running in less than a minute following three simple steps.
Step 1: Put the YUI seed file on the page, pulling down a slim 6.2KB script file off of the Yahoo CDN:
<script type="text/javascript" src="http://yui.yahooapis.com/3.0.0/build/yui/yui-min.js"></script>
Step 2: Make use of any YUI module or submodule. The seed file will take care of calculating your dependencies and loading any additional scripts you need in (usually) a single combo-handled, non-blocking HTTP request. So, you can use the Drag & Drop plugin to make an element draggable like this:
<div id="demo">I'm draggable.</div>
<script type="text/javascript" src="http://yui.yahooapis.com/3.0.0/build/yui/yui-min.js"></script>
<script>
YUI().use('dd-plugin', function(Y) {
Y.one('#demo').plug(Y.Plugin.Drag);
});
</script>
Step 3: There is no step 3. Relax, grab a soda. Work on your short game. Life is good.
YUI 3: use() Anything, But Not Everything
YUI 3′s simplicity of use (particularly in its ability to use() any module with intrinsic, efficient loading) is paired with new levels of power and control.
For example, one of the characteristics you’ll find throughout the YUI 3 project is an emphasis on granularity. We’ve worked hard to take structures that were monolithic in YUI 2 and break them down into smaller packages in YUI 3. As a result, you’ll find that many modules — component-level packages like IO or Animation — are comprised of various submodules. Usually, all you’ll need is the base submodule.
Charting the evolution of components from YUI 2 to YUI 3 tends to yield visualizations like this one for DataSource (comparing gzipped filesizes):
Because any given DataSource implementation is likely to need only one slender submodule from the DataSource family, the savings in terms of performance and K-weight — especially for complex implementations — are often substantial.
Take the time to explore the Dependency Configurator as you’re setting up your YUI().use() statements. Instead of picking top-level modules, explore the submodule structures and see if the featureset you need is encompassed in a submodule. You may find yourself using modules like io-base instead of io and anim-base instead of anim — and saving yourself a lot of K-weight in the process.
YUI Website Updates
Along with the promotion of YUI 3 to general availability with today’s release, we’ve updated the YUI website to better support the growing communities using both YUI 2 and YUI 3. Today, when you visit YUI on the Yahoo! Developer Network you’ll find a meta-page with project-wide links along with direct links into the YUI 2 and YUI 3 areas of the site.
Meanwhile, we continue to build out our project-tracking and forums platform on YUILibrary.com and host the YUI project source code for forking and contributions on GitHub You can also find a lot of YUI folks hanging out in #YUI on Freenode; feel free to drop in and join the conversation as you explore YUI 3.0.0.
September 29, 2009 at 2:23 pm
Glad to hear this!
September 29, 2009 at 2:58 pm
I guess I’ll have to give YUI another go and see if it can replace jQuery in my little projects. The amount of support materials you folks put out for YUI is amazing, if I can get past that “now what?” stage, I’m sure it would be a better base to build my stuff with.
September 29, 2009 at 3:29 pm
I would be very interested to hear how the YUI3.0 development team compares this release to JQuery. What are the relative strengths/weaknesses of each? Are there areas where YUI3.0 is clearly ahead of JQuery? How about the inverse?
September 29, 2009 at 3:51 pm
Very cool. Congratulations guys, I will be poring over the GA in the next couple of days.
September 29, 2009 at 3:56 pm
Congratulations guys – you’ve put a HUGE amount of effort into YUI 3 so it’s good to see it getting it’s first release!
September 29, 2009 at 4:14 pm
I love the brevity of the bootstrapping. Lazy loading should be much more of a standard nowadays. Works around most performance problems.
September 29, 2009 at 4:15 pm
I’ve been pretty exclusively jQuery for a year now, but I’m excited to give this a shot to see what else is possible. Great work, guys!
September 29, 2009 at 4:49 pm
Congratulation! Very nice work, especially around selectors.
September 29, 2009 at 5:08 pm
[...] YUI 3 is out of beta – the changes to YUI needed to run the new Yahoo homepage, smaller, faster, less code to write. [...]
September 29, 2009 at 5:29 pm
[...] today is a complete redesign, the framework became faster, lighter and easier to use, quoting Eric Miraglia: “One of the goals of the YUI 3 redesign was to make it easy to use without sacrificing power, [...]
September 29, 2009 at 5:33 pm
[...] get up to speed on the latest YUI advancements and best practices (with a particular focus on the 3.0.0 release announced earlier today), get the scoop about the road ahead, and share tips and tricks with each [...]
September 29, 2009 at 5:44 pm
I agree with Chris the (6.2KB gzipped) seed file is really one of the hight points.
Congratulations YUI team, the redesign was really amazing!
September 29, 2009 at 6:18 pm
Any idea if/when there will be a YUI Rich Text Editor based on YUI 3?
Thanks
September 29, 2009 at 6:57 pm
Congratulations on the new release! I’m a jQuery user too, but very tempted to give YUI a try.
However, while I see the power of the use() dynamic module include functionality, your Dependency Configurator (DC) doesn’t actually help you with the use() call – it only outputs lines of HTML to make the right JS call… please add an equivalent DC output for use() statements!
September 29, 2009 at 7:15 pm
@MarcusT–Agreed…Configurator should give you the equivalent
use()for your selected modules. No question. We’ll get to it. -EricSeptember 29, 2009 at 7:32 pm
[...] production-ready with today’s release,” Yahoo’s Eric Miraglia said in a blog post Tuesday. “The code we’re shipping today in 3.0.0 is the same code that drives the new [...]
September 29, 2009 at 7:42 pm
@Johan — What I can tell you about the schedule is that the next significant YUI 3 release (3.1.0) will wrap up the widget infrastructure on which something like Editor would depend. There will be some beta widgets shipping with 3.1.0 (Q1 next year), but I would expect a full YUI 3 Editor to come later. Keep in mind that the top-level editor depends on a lot of sub-components — panels, menus, buttons, etc. So we have a lot of work to do. That said, we’ll probably have some stuff for you to play with before the official Editor ship date. Short answer: Editor in 2.8.0 is still the YUI standard for that widget and it will be for a bit longer. -Eric
September 29, 2009 at 8:14 pm
Why isn’t IE8 an A grade browser yet? It isn’t beta anymore.
http://developer.yahoo.com/yui/3/articles/gbs/
September 29, 2009 at 8:23 pm
great release – congrats guys.
September 29, 2009 at 8:25 pm
@Alan —
http://developer.yahoo.com/yui/articles/gbs/
Sorry — the page you found is an old copy, not the current GBS. My bad.
-Eric
September 29, 2009 at 9:17 pm
THANK YOU SO MUCH for fixing so many issues with Google Chrome and IE 8 and the YUI History component!!!! This just made my entire week!!!!
September 30, 2009 at 12:58 am
Yuppie!! Cannot wait to use it :) Thank you guys!!
For my running projects I will stay on 2.8.0 because the missing widgets, meanwhile I will have the time to study and get used to the new version.
September 30, 2009 at 1:27 am
Kudos to the yui team! This YUI3 is definitely better than YAHOO.Utils.Dom.Yadda.Yadda.Yadda… Wondering why you left a bug on Node…
http://yuilibrary.com/projects/yui3/ticket/2528057
September 30, 2009 at 2:44 am
What does this mean for YUI 2.x? Will we ever see YUI 2.9 and 2.10, etc with any further improvements, or do we need to start planning migration?
The roadmap for YUI2 only goes as far as “YUI 2.8.1 if needed”…
September 30, 2009 at 3:14 am
[...] da annuncio sul blog ufficiale, è da ieri disponibile a tutti per il download la versione di YUI, il [...]
September 30, 2009 at 3:31 am
[...] The YUI team has put out YUI 3.0: We’re pleased to announce today the general-availability release of YUI 3.0.0. YUI 3’s core infrastructure (YUI, Node and Event) and its utility suite (including Animation, IO, Drag & Drop and more) are all considered production-ready with today’s release. [...]
September 30, 2009 at 5:41 am
[...] das Javascript- und CSS-Framework von Yahoo!. Eric Miraglia beschreibt ausführlich die Neuerungen von YUI3. In der neuen Version ist die Syntax verändert. Sie ist zwar noch immer nicht so schön [...]
September 30, 2009 at 5:51 am
I too wanted to know more information about the plans for YUI 2.x.
Since YUI 3 is “revolutionary” rather than “evolutionary”, migration is no easy task (especially if I don’t want to run the 2 in parallel).
Will the YUI team continue to support and develop for YUI 2.x , or will it not be left up to the community?
September 30, 2009 at 6:38 am
Ken, Dominykas — We’re spending more time on YUI 3 than on YUI 2 at this point. While we’re continuing to maintain the 2.x codeline, and we expect to do additional releases, major new functionality is likely to come from the community rather than from the core engineering team at Yahoo. Note that we’ve already seen this process underway, with the 2.8.0 release deriving major content from contributors. -Eric
September 30, 2009 at 6:53 am
Awesome work guys!
September 30, 2009 at 6:57 am
Im happy that theyve released this and its a significant step in usability of YUI, however until they release YUI 3.0 versions of the widgets I struggle to have motivation to bother upgrading. The widgets are the real place where YUI shines above others because of their standardized look, extremely good documentation, wide range of browser support etc etc. However I still find it better to use jquery or MochiKit for general browser stuff. Maybe when the widgets all come out for 3.0 I will be able to use YUI for everything which would be sweet.
September 30, 2009 at 9:34 am
Superb work. Will be playing around with it.
Thanks
September 30, 2009 at 10:47 am
My short game needs lots of work :)
September 30, 2009 at 4:39 pm
What about YUI Grids? I see the other CSS technologies there (Base, Reset, Fonts) but no grids. Is YUI Grids being discontinued? Should I be looking to another CSS framework?
September 30, 2009 at 6:12 pm
Peter,
http://tech.groups.yahoo.com/group/yui3/message/726
Grids still ships with YUI 2, but we are re-evaluating the approach for YUI 3. We expect to ship a YUI 3 Grids component, but we’re still working on the approach.
-Eric
September 30, 2009 at 8:17 pm
Nice work, guys. Can’t wait to play around with it.
September 30, 2009 at 10:52 pm
Are there exist cheatsheets (in pdf format) for yui 3.0?
October 1, 2009 at 9:43 am
Sergey — No, there aren’t any cheatsheets for 3.0.0 as yet. -Eric
October 2, 2009 at 12:58 am
Been waiting for this release, big thumbs up for the YUI team, especially for releasing such an API (same that drives the Yahoo home page) to the public.
October 3, 2009 at 1:34 pm
[...] La nouvelle version de la librairie AJAX et autres animations est disponible. Comme la librairie Google Ajax API, il est possible de ne charger qu’un noyau très léger (moins de 10Ko) et ce noyau prendra ensuite en charge le chargement dynamique des librairies supplémentaires. [...]
October 8, 2009 at 5:03 am
I have downloaded YUI 3 library but don’t find date picker control for my purpose, it was in YUI 2.x..?? should i wait for upcoming release for this.
October 8, 2009 at 6:32 am
Ashish,
YUI 2 is still a fantastic library for widgets like Calendar — we’ll get those done for YUI 3 as well (starting in Q1 next year), but for now stick with YUI 2. And you can always use YUI 2 and 3 together:
http://developer.yahoo.com/yui/3/examples/yui/yui-compat.html
-Eric
October 16, 2009 at 8:25 pm
My goodness!!! I started using YUI3 last week, took several hours just to get the hang of the new syntax… but let me tell you, those were hours VERY well spent! I am LOVING YUI3!!! The new approach for custom event handling is SUPERB! The Plugin architecture is amazing! And the “Candy” is so appreciated! I just can’t wait for the widgets to launch!
October 22, 2009 at 9:39 am
[...] YUI 2.8.0, YUI 3.0.0, and PHP Loader 1.0.0 beta 1 out the door, the team here is focused on our final big objective for [...]
March 24, 2010 at 7:57 am
My short game needs lots of work :)