To celebrate the launch of the public beta of the new Yahoo! home page, I want to peel back the interface and point out a few things of interest to developers.
First of all, I’m very proud that the new Yahoo! home page uses the open-source Yahoo! User Interface Library extensively. To be clear, the exact lines of code available to the world for free are used by Yahoo!’s new flagship page. The Library’s a la carte design lets them use just the components they need: Connection, DOM, Animation, and Event, as well as CSS Fonts and CSS Reset. This illustrates several things, including the industrial-grade functionality of the YUI Library, the validity of an a la carte approach, and our commitment to continued development and support of this library.
JSON, (the light-weight data interchange format well suited to Ajax applications and championed by our own Douglas Crockford), is used extensively on the new home page. JSON has many advantages, as Douglas most-recently spoke about at The Ajax Experience conference last week. Of the many advantages of JSON, three were quoted repeatedly in my talks with the home page team. First, it’s a native JS data structure so no extensive parsing is required (like there is when using XML). Second, there is less data to transport compared to XML. And finally, since it is so readable, development and debugging are more pleasant and efficient.
On the CSS side, notice the extensive use of CSS Sprites. Though not new, this technique is one of the best ways to optimize a site. By using sprites instead of individual images, 15 separate home page image calls are combined into a single HTTP request. Every HTTP request has a significant negative effect on performance — therefore reducing requests should always be a priority.
As you can imagine, the home page team has been hard at work. The hard work continues as they continue improving the beta, rolling out enhancements, and expanding to more countries. If you have technical questions, please feel free to leave a comment and I’ll do my best to get answers from the team for a followup in-depth article here.