Friday, November 16th, 2007

Yahoo! Search Contextual Precaching

Category: Performance, Yahoo!

Yahoo! Search does an interesting bit of caching. To see it in action, go to the main search page with Firebug enabled and ready (or any tool that lets you see network traffic). Then type any character into the search input box and you will see some traffic kick off to download items such as:

http://us.js2.yimg.com/us.js.yimg.com/lib/s3/ysch_srp_clean_200711061918.css
http://us.js2.yimg.com/us.yimg.com/i/us/sch/el/att_hdspr_1.6t.png
http://us.js2.yimg.com/us.js.yimg.com/lib/s3/ysch_srp_clean_200711051714.js
http://us.js2.yimg.com/us.yimg.com/i/us/sch/gr2/sprt_srp_core_6.gif
http://us.js2.yimg.com/us.yimg.com/i/us/sch/el/ng_bg.png

What are these files? They are artifacts for the results page. So, Yahoo! groks that you obviously are going to do a search once you start to type something in, so why not go ahead and preload the files that are needed as part of the results page? Nicely done.

Yahoo! Search Caching

Posted by Dion Almaer at 9:07 am
14 Comments

++++-
4.3 rating from 43 votes

14 Comments »

Comments feed TrackBack URI

That’s pretty smart. Does it preload javascript and css files too?

Comment by Jordan — November 16, 2007

Jordan: that’s what the first two URL are (.js and .css).

Comment by Olivier — November 16, 2007

We did something like this over a year ago with an online demo of our Workflow Designer JavaScript widget.

We cached all of the resources needed for the actual Designer on the license agreement page in the background. This took the initial load time from 14 seconds to about 3 seconds. We populated the cache with the Designer HTML page and all necessary CSS, JavaScript, and XML. It made a big difference in the user experience, saved them about 11 seconds.

Comment by Eric Rich — November 16, 2007

If only their mail app was this fast. My girlfriend rolled back to the classic version because it’s just unusable.

Comment by Tinus Guichelaar — November 16, 2007

Wow. That’s extreme!
This sounds like a good candidate for somebody to create a library/tool/module to pre-load anticipated dependencies. You wouldn’t want to hard-code these dependencies into your pages if there were more than a few. That would get to be a maintenance nightmare.
It could be done with a dojo build-time add-in or with a FreeMarker macro, I’ll bet.
Anyone want to bring anticipated dependency pre-fetching to the masses???

Comment by John Hann — November 16, 2007

@Tinus
That’s funny, I just rolled back to the classic version too – because they changed something recently that started crashing Firefox whenever I would close the window :(

This is a neat idea – thanks for sharing!

Comment by Peter Mularien — November 16, 2007

@Peter

Firefox is also crashing on me, but when when I close GMail… I think the problem is in Firefox itself, not in the app (this problem seems to have appeared in a very recent version of Firefox, 2.0.0.9 maybe)

Comment by Julien Lecomte — November 16, 2007

precaching… this is newsworthy?

…people were precaching things back in the mid 90’s. Precaching’s just a part of providing a better user experience. But apparently everyone’s forgotten the trick enough so it can be “reinvented” by yahoo. gravy.

Comment by Arron Bates — November 16, 2007

@Arron

I think it never hurts to talk about old patterns once in a while. Don’t forget that new people enter the work force every day and may not know them.

Comment by Julien Lecomte — November 16, 2007

but this will slow down the search page, isn’t it?

Comment by chenggn — November 16, 2007

yeps, this is what I would call “conditional preloading”, where you’re smart about anticipating your users’ next steps and caching page components.

There could also be the “unconditional preloading” where you always preload. Examples? yahoo.com loads a JS and a CSS stylesheet onload. google.com preloads a css sprite onload. Check http://www.google.com with Firebug’s Net Panel on and you’ll see this image
http://www.google.com/images/nav_logo3.png
which is not needed until the next page.

More about this here – http://www.sitepoint.com/article/web-site-optimization-steps/3

Comment by Stoyan — November 17, 2007

Julien Lecomte, it wouldn’t slow down the search page. Once you’ve input something ( and while you input the rest of the search term(s) ) into the search box they preload images which will be displayed in the nest page so when you do click “Search” those images will be in your cache already.

Go Yahoo! – I still like Google better… :-)

Comment by Web Design NY — November 17, 2007

So as soon as you type something, it loads a 30kb javascript file, and some other bits… That’s just brilliant!. The final results page should be a lot less than that; explain to me why caching something that is a lot bigger than the final page should be is smart???
What if you were on dial up? This would be horrendous!

Comment by yoink — November 18, 2007

Don’t forget that new people enter the work force every day and may not know them.

Comment by CARISOPRODOL — November 28, 2007

Leave a comment

You must be logged in to post a comment.