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.
If you know JavaScript but have yet to make the leap to unobtrusive JavaScript, read on. I'll demonstrate how to upgrade a traditional DHTML rollover to an unobtrusive script and then to a script that leverages the Yahoo! User Interface Library's (YUI).
The PHP Developer Tools Project reached a major milestone this week with the version 1.0 release of PDT. I had recently installed the all-in-one Europa/PDT release and received errors when attempting to update via the Update Manager—something about being unable to unzip a package. Today, however, everything seems fine and when I reviewed Help -> Software Updates -> Manage Configuration -> PDT Feature, it showed version 1.0 as installed.
UPDATE: AHS has been updated to v0.3.9.7 to eliminate the YUI Event.addListener(window, 'resize', function) issue!
Alex Iskold over at Read/Write Web posted a great article about JavaScript's performance impact on blog sites today. Like most blogs, this site relies on several single lines of JavaScript to power interface features, display widgets, and process data. This site, as well as all of the others that load things like Google Adsense, loads a little bit slower.
YUI 2.3 was released and sports several new components plus improvements to existing features. Most notable in my opinion is the addition of RTE or rich text editor. The RTE looks nice and is extensible, just like TinyMCE editor.
Also of note is the addition of YUI Base CSS which extends YUI Reset and Font. Base CSS brings back basic size and spacing styles for headings, paragraphs, lists, and other HTML elements that are stripped by YUI Reset. Base CSS provides a great set of styles that look great and are easy to apply.