dns prefetch / pre-resolve hostname - how effectiv

Question

I've been reading up on how this works but am struggling to make sense of it.

From what I can tell if I set <link rel="dns-prefetch" href="//ajax.googleapis.com" /> in the head of my webpage I should see a faster request completion is I reference any assets on this domain. [ref]

Now there are two issues which are currently bothering me:

1) Does this only help for future page requests

What I mean is if I am using Google's CDN to get jQuery on every page in my site will adding the <link /> above any difference? Or will it only help if, say, I am not referencing the CDN on my homepage but am on all other pages? In this second option the user would hit the homepage, resolve and cache the DNS host ready for the download on my content pages.

2) How can I test the effectiveness of this?

I suppose if I knew the answer to this I'd have a better understanding of issue 1. I'm trying to use Firebug and Chrome developer tools and watching the Net and Resources panels but I'm seeing no significant difference. The only trend I can see is that, if anything, it is taking longer to complete my request when I'm using the <link />!!

I have read the documentation on MDN and the Chromium Blog (both old!) but I'm still just not getting it.

Any help will be appreciated - thanks!

UPDATE - 22/01/2013

Just read some more around this issue and thought I should include the links for people with this same question. csswizardry has written a great article on performance in which he references this issue and links to more research from perfplanet. If anyone have more information / insight about this please add an answer!

This is a link to another, more recent, SO question - hopefully this will help people find the answers they are looking for.

Answer 1

In the first case, DNS pre-fetching will not help as you are loading the same resource on each page. The resource should be cached on subsequent requests, so pre-fetching the dns record won't have any effect.

In the second case, simply removing and adding the link element is not sufficient to test the effect of prefetching. Even without the link element, the browser will scan hrefs to determine which domains to prefetch - the link tag is meant to tell it to prefetch a domain in addition to those the browser would find - this is useful in the case where you know a link to one domain is ultimately redirected to another.

One way to see the effect of the prefetch tag would be to set up a few sites. www.example.com/index.html would contain a link to www.anotherexample.com which would, in turn, redirect to www.athirdsite.com. If you were to test this configuration with and without a link tag pointing to www.athirdsite.com, you may see that it is faster with the link tag. You are far more likely to see this effect if the nameserver in use has high latency.

In closing, I'd simply let the browser do its thing unless you have a very particular reason for instructing it to do something else in addition.