HTML5页面资源预加载(Link prefetch)写法
来源:互联网 发布:mac可以练vf 编辑:程序博客网 时间:2024/05/22 08:01
不管是浏览器的开发者还是普通web应用的开发者,他们都在做一个共同的努力:让Web浏览有更快的速度感觉。有很多已知的技术都可以让你的网站速度变得更快:使用CSS sprites,使用图片优化工具,使用.htaccess设置页面头信息和缓存时间,JavaScript压缩,使用CDN等。我曾经介绍过本站上使用的一些速度优化技术。而在HTML5里,出现了一个新的用来优化网站速度的新功能:页面资源预加载/预读取(Link prefetch)。
简单说来就是:让浏览器预先加载用户访问当前页后极有可能访问的其他资源(页面,图片,视频等)。而且方法超级的简单!
<!-- 预加载整个页面 --><link rel="prefetch" href="http://www.webhek.com/misc/3d-album/" /><!-- 预加载一个图片 --><link rel="prefetch" href=" http://www.webhek.com/wordpress/wp-content/uploads/2014/04/b-334x193.jpg " />
HTML5页面资源预加载/预读取(Link prefetch)功能是通过
Link
标记实现的,将rel属性
指定为“prefetch”,在href属性
里指定要加载资源的地址。火狐浏览器里还提供了一种额外的属性支持:<link rel="prefetch alternate stylesheet" title="Designed for Mozilla" href="mozspecific.css" /><link rel="next" href="2.html" />
HTTPS协议资源下也可以使用prefetch。
什么情况下应该预加载页面资源
在你的页面里加载什么样的资源,什么时候加载,这完全取决于你。下面是一些建议:
- 当页面有幻灯片类似的服务时,预加载/预读取接下来的1-3页和之前的1-3页。
- 预加载那些整个网站通用的图片。
- 预加载网站上搜索结果的下一页。
禁止页面资源预加载(Link prefetch)
火狐浏览器里有一个选项可以禁止任何的页面资源预加载(Link prefetch)功能,你可以这样设置:
user_pref("network.prefetch-next", false);
阅读全文
0 0
- HTML5页面资源预加载(Link prefetch)写法
- HTML5的页面资源预加载技术(Link prefetch)加速页面加载
- 使用HTML5的页面资源预加载(Link prefetch)功能加速你的页面加载速度
- 使用HTML5的页面资源预加载(Link prefetch)功能加速你的页面加载速度
- HTML5的页面资源预加载技术(Link prefetch)加速页面加载
- html5新功能5—使用HTML5的页面资源预加载(Link prefetch)功能加速你的页面加载速度
- link prefetch预加载
- HTML5 link prefetch
- HTML5中的prefetch预加载功能初探
- HTML5 prefetch
- 详解HTML5中rel属性的prefetch预加载功能使用
- html5预加载图片的写法
- [译] HTML5 prefetch
- 【译】HTML5 prefetch
- html5滚动页面简单写法
- 利用HTML5实现页面预加载
- IOS页面加载Html5页面
- DNS预获取 dns-prefetch 提升页面载入速度
- java集合基本知识点
- Linux学习之基础篇_2017.8.5
- 模拟串口实现方案
- SyntaxHighlighter代码高亮插件
- gtest的介绍和使用
- HTML5页面资源预加载(Link prefetch)写法
- 拓扑排序的原理及实现
- C++中hash_map和map接口简介
- vue实力封装axios
- Linux入门教程:Linux权限管理
- 使用Thinkphp框架,将某些东西写进log日志,日志写入方法
- javascript定时任务执行脚本
- 【面试题】Redis相关
- Android自定义捕获Application全局异常