Quantcast
Channel: Ajaxian » HTML
Viewing all articles
Browse latest Browse all 20

HTML5 Link Prefetching

$
0
0

From David Walsh comes a good writeup on the HTML5 link prefetch tag:

HTML:
  1.  
  2. <!-- full page -->
  3. <link rel="prefetch" href="http://davidwalsh.name/css-enhancements-user-experience" />
  4.  
  5. <!-- just an image -->
  6. <link rel="prefetch" href="http://davidwalsh.name/wp-content/themes/walshbook3/images/sprite.png" />
  7.  

You use the link tag to do prefetching, setting the rel to "prefetch" and giving the URL to the resource to prefetch. When should you use link prefetching?

Whether prefetching is right for your website is up to you.  Here are a few ideas:

  • When a series of pages is much like a slideshow, load the next 1-3 pages, previous 1-3 pages (assuming they aren't massive).
  • Loading images to be used on most pages throughout the website.
  • Loading the next page of the search results on your website.

Some things to know about link prefetching though:

A few more notes about link prefetching:

  • Prefetching does work across domains, including pulling cookies from those sites.
  • Prefetching can throw off website statistics as the user doesn't technically visit a given page.
  • Mozilla Firefox, currently the only browser to support prefetching, has actually supported prefetching since 2003.

Viewing all articles
Browse latest Browse all 20

Trending Articles