YUI developers team releaes the first preview of the third version of yui library. Here's the short excerpt from official announce:

«The YUI team is pleased to announce the public availability of YUI 3.0 Preview Release 1, an early look at what we’re working on for the next generation of the YUI Library. Documentation for YUI 3.0 is on the YUI website; the download is available on the YUI project area on SourceForge; you can find us with questions or comments on the YUI 3.x discussion forum. Keep in mind that this is an early preview, not a production-quality (or even a beta) release. This release is not suitable for production use, but it will give you an idea of what we’re working on, and it should provide a good framework for conversation about the future of the library.»

Source: YUI blog.

AccordionView is a new widget for YUI library created by Marco van Hylckama Vlieg. It has the following features:

• width: css value for width including unit (example: ‘400px’, ‘15em’, etc.)

• expandItem: index of item to expand at initialization, default is none. 0 is the first, 1 the second, etc.

• animationSpeed: speed in seconds for animation. The default is 0.7

• animate: true or false, default is true

• effect: YUI Animation effect to use on animation. See the documentation on YAHOO.util.Easing. Default is YAHOO.util.Easing.easeBoth

• collapsible: true or false, whether the whole thing can be collapsed or not, default is true

• expandable: true or false, whether the whole thing can expand (true) or act as an accordion where only one item can be open (false). default is false

• hoverActivated: true or false, when set to true, the items are activated on hover. Note that this activates on click ALSO in order to keep keyboard navigation working.

Source: YUI Blog.

Tenni Theurer post the next article about improving the performance of web applications. Thisd time tenny tewlls about combining the script files to serve it faster. Here's small excerpt from this article:

«In Performance Research Part 1, we discussed how reducing the number of HTTP requests has the biggest impact on improving the response time and is often the easiest performance improvement to make. One technique without having to simplify the page design is to combine multiple scripts into a single script, and similarly combine multiple stylesheets into a single stylesheet.»

Source: YUI blog.

Todd Kloots writes about context menus an focus in Opera Browser. He writes:

«As a JavaScript toolkit developer, there are two features lacking in Opera that have frustrated me for a while: support for the contextmenu DOM event and the ability to override the default rendering of focus via CSS. When Opera released version 9.5, I was disappointed to see that neither of these features were implemented. As frontend engineers, we spend a lot of time responding to decisions made by browser manufacturers, but we don’t get much opportunity to learn the specific thought process behind those decisions. After exchanging some emails with the Opera team, I now have some insight into their decisions and the perspective that perhaps withholding such features could be beneficial to the user »

Source: YUI Blog.

Eric Miragilla tells about new combo handler service available for Yahoo-hosted JS. Here's excerpt from this article:

«We’ve been talking for a long time at Yahoo about the importance of minimizing HTTP requests to improve performance. One important technique for YUI users has long been to use the pre-built "rollup" files (like yahoo-dom-event.js, which combines the YUI Core in a single minified HTTP request) and to create custom rollups that aggregate all of your YUI JS content in a single file. You’ll notice that we do a lot of this on our core Yahoo properties. For example, if you go to check on the Tour de France on Yahoo! Sports, you’ll find that numerous YUI components are aggregated with custom Sports-specific JS resources in a single HTTP request (here’s the aggregate file).»

Source: YUI blog.

You can view the new video of Dion Almaer talk on the YUI Theater in which Dion speak about Google Gears, App Engine and more.

Source: YUI Blog.

YUI Developerrs team announced an update to Graded Browser Support in YUI blog. This post covers the following topics:

• Primary Changes

• GBS Forecast

• Notes Specific to the YUI Library

Source: YUI Blog.

Rajat Pandit has created bookmarklet for the YUI Logger control. Here's the small excerpt from his blog post related to this widget:

«During development using javascript I have always felt that it would be useful to be able to easily add and remove YUI Logger without having to deal with manually adding and removing the related javascript and css from the source files.

I resolved this problem by writing a bookmarklet which will allow you to do that easily. »

Source: Connecting the dots.

Christian Heilmann post an article in which he tells about using JavaScript to create adaptive grids. He writes:

«I love YUI Grids. I know my CSS and I know how to work around different problems of browsers, but I am also very much bored about having to fix and test and create these workarounds over and over again. While YUI Grids might not be perfect for all cases of web development out there, I am happy to take a pragmatic approach and just create sites that can be done with them (now you also know why I am not a designer).

One problem I keep having when I put some YUI Grids-based sites live is that people complain about me expecting a certain screen resolution or viewport size. YUI grids can either be 100% wide, which can be pretty silly on high resolutions, or optimized for resolutions of either 800×600 or 1024×768. When you optimize for 800 pixels people on higher resolutions will complain about the length of the page and when you go for 1024 people will say they have to scroll to see your side-bar on 800×600. You can’t win.»

Source:YUI blog.

There is an intresting article about building your own widgets libraries with YUI. Here''s the short table of contents of this article:

• Customizing Existing YUI Components

  • Using YAHOO.lang.extend

  • Creating and Using Shortcuts for Common YUI References

  • Registering a Component with YUI

• Developing Wholly New Widgets with YUI

  • The YUI Element Utility as a Foundation for Component Development

  • Managing DOM Events and Custom Events with Element

  • A Closer Look at extend

  • Element and AttributeProvider

  • Adding a render Method

  • Adding a Destructor

  • Subclasses

  • Bundling Functionality: The Field Object and the Fields Object

• Progressive Enhancement

• CSS Sprites

• Final Thoughts

Source: YUI Blog.

There is a intresting article posted in YUI Blog about image transformations in canvas with sliding. Here's small excerpt from this article:

«We’ve been obsessed with the canvas tag for a while now; we think it represents a huge opportunity for creative interfaces on the web, and current browser support for the tag is excellent (as long as you don’t mind using excanvas.js for IE6/7). That being said, there are some limitations. The only available built-in transformations are translation, rotationg and scale. Performing a complex transformation, such as keystoning an image so that it can be used in a faux 3D environment, has been difficult.

However, there is an easy way to simulate arbitrary transformations on images in canvas. If you cut the image into slices, you can redraw each slice with different dimensions. The code is simple: using the slicing variation of the drawImage method, it’s possible to take a slice of a source image and draw it to the canvas. This slice can be scaled horizontally and vertically according to a formula. As the number of slices increases, the edges of the image become smoother and less jagged. It’s important to note that you only need one copy of the source image, and that drawing many slices doesn’t mean there are many copies of the image in the page. You are able to use one source image to draw multiple images on a destination canvas.»

Source: YUI blog.

YUI 2.5.2 released with following features:

• Anticipating Opera and Firefox updates: When Firefox 3 and Opera 9.5 go GA this summer, they will be A-Grade browsers, and we wanted to make sure that we anticipated those debuts with a release that was validated against the latest betas available. YUI 2.5.2 was tested against Opera 9.5b2 and Firefox 3.0RC1. In both cases, the new browsers look terrific, and this YUI release incorporates several changes that will help users make the upgrade seamlessly.

• Major bug fixes: DataTable, Menu, Rich Text Editor and Button are the key beneficiaries of bug fixes in 2.5.2, but dozens of fixes are provided throughout the library. Check out George Puckett’s release rollup in the YUI Community Forum for a complete rundown of what has changed in this release.

• Charts Control: The experimental Charts Control is upgraded for 2.5.2 with support for integral legends and for three new series styles.

• ActionScript Source: The ActionScript source for components that use Flash (Charts and Uploader) is now available as part of the download for developers who want to dig more deeply into these components.

Source: YUI.

There is an intresting atutoorial about YUI basics posted on the O’Reilly’s InsideRIA blog by Eric Miragilla. He writes the following:

«YUI consists of several CSS components and nearly three dozen JavaScript components, all of which are designed to empower the rapid creation of web applications that run in all the major web browsers. Yahoo! uses a Graded Browser Support approach in which we "white-list" a subset of browsers that we'll fully support — we call these the "A-Grade browsers," and, taken together, they represent more than 90% of traffic on Yahoo!'s network worldwide. YUI is tested and supported in all A-Grade browsers (including current versions of Safari, Opera, Firefox and Internet Explorer).

The best way to think about YUI and what it does for you is to consider the difference between the user interface language of the browser as compared with the desktop. In the browser, the "default" language is relatively limited. You have form elements (buttons, select menus, text inputs) and hyperlinks. On the desktop, you expect much more: Tabs, sliders, cascading menus, dialogs, tooltips, data grids, rich text editing, drag and drop, animation, autocompletion, and so on. Here's one way to visualize this difference, with the browser's native UI elements on the left and the richer set of desktop-style UI elements on the right:»

Source: O’Reilly’s InsideRIA blog

2 tablespoon site publish the second part of article about Rollovers images in YUI. Here's the small excerpt from the beginning of this article:

«In my previous article we traded in old school JavaScript habits for unobtrusive methods and the Yahoo! User Interface Library (YUI). The YUI's Event and DOM extensions greatly simplify basic DOM scripting tasks. Let's build on this foundation and improve the rollover script's performance and scalability.

Thanks to Nick and Dirk for their comments on event listeners impact on script performance. Nick points out the fact that JavaScript performance will degrade as more buttons are added to the example rollover menu. The use of a DOM scripting technique called event delegation can greatly reduce performance hits sustained through the assignment of event listeners.»

Source: 2 tablespoon.

David Cilley publishing a series of articles about YUI Slider Control. In this article David tells how to provide real-time previewing of image changes. He writes:

«One of the most common dialogs in an image editor application is the slider with preview.  When you move these applications over to the Web, you end up losing some of the user experience because of the asynchronous nature of these apps.

There are several ways to use a JavaScript slider to change an image, and I will be covering at least 3 of them over the next few posts.»

Source: YUI blog.