HTML5中的prefetch预加载功能初探

jackyrong

在HTML5中,有个很有用但常被忽略的特性,就是预先加载(prefetch),它的原理是:
利用浏览器的空闲时间去先下载用户指定需要的内容,然后缓存起来,这样用户下次加载时,就直接从缓存中取出来,效率就快了.
  目前,只有firefox和chrome支持这两个特性,chrome是在version 13后开始支持的,
safri和ie依然不支持.
  举个例子说明:比如要预先加载某个页面,可以这样:
<link rel="prefetch" href="http://www.example.com/"> <!-- Firefox -->
但如果是google的话,要用另外的一个名称,即:
<link rel="prerender" href="http://www.example.com/"> <!-- Chrome -->
  即使在不支持的浏览器,用了这个特性其实是不会出错的,只不过浏览器解析不到而已,
所以,如果你感觉能有办法预先预测到用户期望点的页面(比如用户看最新的受欢迎的热图,他
可能看了第一页后,会继续看下一页,这个时候就可以用预先加载这个特性了).比如
  <link rel="prefetch" href="<?php echo get_next_posts_page_link(); ?>">
  而单独取一张图片也是可以的,比如:
   <link rel="prefetch" href="/images/test.jpg"/>