HTML5中的prefetch预加载功能

标签: HTML/CSS/XML | 发表时间:2011-10-09 17:49 | 作者:濯焰 iVane
出处:http://duanxin.me
在HTML5中,有个很有用但常被忽略的特性,就是预先加载(prefetch),它的原理是:利用浏览器的空闲时间去先下载用户指定需要的内容,然后缓存起来,这样用户下次加载时,就直接从缓存中取出来,提高效率。 目前只支持Firefox 3.5+,chrome 13+,在不支持的浏览器,用了这个特性也不会出错的,只不过浏览器解析不到而已。 要想预先加载某个页面,可以用以下写法: <link rel="prefetch" href="http://duanxin.me/"> <!-- Firefox --> <link rel="prerender" href="http://duanxin.me/"> <!-- Chrome --> 还可以加载静态文件,例如预先加载某张图片: <link rel="prefetch" href="/images/pic.jpg"/>

相关 [html5 prefetch 加载] 推荐:

HTML5中的prefetch预加载功能

- iVane - duanxin.me
在HTML5中,有个很有用但常被忽略的特性,就是预先加载(prefetch),它的原理是:利用浏览器的空闲时间去先下载用户指定需要的内容,然后缓存起来,这样用户下次加载时,就直接从缓存中取出来,提高效率. 目前只支持Firefox 3.5+,chrome 13+,在不支持的浏览器,用了这个特性也不会出错的,只不过浏览器解析不到而已.

HTML5的页面资源预加载技术(Link prefetch)加速页面加载

- - HTML5资源教程
不管是浏览器的开发者还是普通web应用的开发者,他们都在做一个共同的努力:让Web浏览有更快的速度感觉. 有很多已知的技术都可以让你的网站速度变得更快:使用CSS sprites,使用图片优化工具,使用.htaccess设置页面头信息和缓存时间,JavaScript压缩,使用CDN等. 我曾经介绍过本站上使用的一些速度优化技术.

【ActiveMQ Tuning】Prefetch Limit

- - 博客园_首页
   摘要:ActiveMQ优化 客户端优化 预取限制. 原文: http://fusesource.com/docs/broker/5.4/tuning/GenTuning-Consumer-Prefetch.html. Overview:图列4.1阐明了Broker在等待之前发送给客户端消息的反馈的行为.

memory prefetch浅析

- - 搜索技术博客-淘宝
最近在用vtune分析程序性能瓶颈时,发现一些内存访问的地方竟然成了cpu热点. 经过仔细分析,发现这些热点主要是对大数组非连续位置的访问的引起的. 比较消耗cpu的原因应该是cache不命中. 因为像这样局部性很差的内存访问逻辑,对cache是很不友好的. 于是想到了prefetch……. x86(以及其他很多体系结构)的CPU提供了prefetch系列指令,用于将指定地址的内存预取到cache.

Web性能优化:prefetch, prerender

- - Harttle Land
本文从预加载的角度介绍如何优化页面载入和渲染的性能,在展开内容之前先了解一下浏览器显示页面的过程: 首先是DNS解析,然后建立TCP连接,接着下载HTML内容以及资源文件,最后才是整个页面的渲染. 图片来源: https://docs.google.com/presentation/d/18zlAdKAxnc51y_kj-6sWLmnjl6TLnaru_WH0LJTjP-o/present?slide=id.gc03305a_0106.

5个基于HTML5的加载动画推荐

- Tim - ITeye资讯频道
在Web开发中,加载动画是非常有用的,不要低估它,它可以让网站响应用户的交互,让用户知道服务器正在处理请求,并告知用户需要等待一段时间. 通常加载动画是GIF格式的,但是现在我们有强大的浏览器和技术(VML和Canvas),加载动画不再只限于GIF格式,它可以由JavaScript来生成,并高度可定制,以下是我整理的5个JavaScript实现的加载动画方案.

HTML5 logo 发布

- Greyby - 酷壳 - CoolShell.cn
2011年1月19日,W3C发布了HTML5的log,打开W3C的页面,下在的图片印入眼前. 我的第一感觉,就像是看到了小时候看的八一电影制片产的电影. 这分明是号召全世界的无产Web程序员们团结起来,不畏艰难,不怕牺牲,一定要把HTML5的革命事业进行到底. 所以,请各位Web程序员不但在你们的HTML5的网页上加上下面的徽章(关于各个徽章的含义,请参看这里).

html5 canvas入门

- - Marshal's Blog
可以把canvas看做div,不过,它的长和宽不能通过css来定义,要使用标签属性:. 或者javascript对象属性设置:. 使用canvas,只有一种操作方式,使用javascript. 获得canvas对象的上下文对象,该对象是操作canvas的主要对象:. 使用canvas画最简单的线, 点击运行示例,结果看起来是这样:.

HTML5新特性

- - CSDN博客推荐文章
 通过fillStyle和strokeStyle 属性可以轻松的设置矩形的填充和线条. 颜色值使用方法和CSS 一样:十六进制数、rgb()、rgba() 和 hsla. 通过 fillRect可以绘制带填充的矩形. 使用 strokeRect 可以绘制只有边框没有填充的矩形. 如果想清除部分 canvas可以使用clearRect.

【转载】HTML5 Messaging

- - HTML5研究小组
HTML5 的Message API能够让HTML5页面之间传递消息,甚至这些页面可以不在同一样域名下. 为了让消息能从一个页面发送到另一个页面,主动发送消息的页面必须拥有另一个页面的窗口引用. 然后发送 页面针对接受页调用 postMessage() 方法. postMessage() 方法中 origin 参数的值必须与页面所在的iframe的域名相匹配.