Html5中prefetch和prerender有什么用-创新互联

这篇文章主要介绍Html5中prefetch和prerender有什么用，文中介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们一定要看完！

创新互联建站长期为数千家客户提供的网站建设服务，团队从业经验10年，关注不同地域、不同群体，并针对不同对象提供差异化的产品和服务；打造开放共赢平台，与合作伙伴共同营造健康的互联网生态环境。为兖州企业提供专业的网站建设、成都网站建设，兖州网站改版等技术服务。拥有十载丰富建站经验和众多成功案例,为您定制开发。

prerender / prefetch

其实是为了提升网页加载速度而但是一直通过预加载来实现，提升用户感受的方式，例如用户在首页停留2s, 而这2s里面我们就已经加载了一个用户可能要打开的页面，那么用户打开的速度会非常快. 给用户的感受也是极好的

HTML5 Prerender / Prefetch名词解释

prefetch usage:

It should be used for fetching and caching resources for later user navigation as per the official HTML5 spec (i.e. prefetching a css file to be used in a page which highly likely to be used by the user in his upcoming navigation). Supported in Chrome, Firefox & IE.

简单说就是缓存下一个网页的资源，是HTML5的新特性, 支持的浏览器有Chrome(13以后),  Firefox, IE 11

prerender usage:

It should be used for prerendering a complete page that the user will highly likely navigate to it in his upcoming navigation (i.e. like prerendering the next article where it is highly likely that the user will click on “next article” button). Supported only in Chrome & IE.

Prerender是Google的一个发明，正在提升用户减少用户在加载时的等待, 通过最相近匹配原则来加载例如“下一页”的文章., 例如最佳推荐，当用户访问A页面的时候, 用户最可能访问的下一个页面上B 那么就预加载B页面, 以达到提升加载速度的效果, 支持的浏览器有Chrome , IE11

使用方法

is actually part of the HTML 5 spec.
appears to be Google doing their own thing.

第一中方法是 将以上链接添加到xxx

第二种方法是 使用JS代码注入方式；

var myHead = document.getElementsByTagName(‘head’)[0];
var myLink = document.createElement(‘link’);
myLink.setAttribute(‘rel’, ‘prerender’);
myLink.setAttribute(‘href’, ‘http://apple.com/ipad’);
myHead.appendChild(myLink);

或者使用Jquery方法：

$(“head”).append(‘www.guoli.biz/’);

以上是“Html5中prefetch和prerender有什么用”这篇文章的所有内容，感谢各位的阅读！希望分享的内容对大家有帮助，更多相关知识，欢迎关注创新互联成都网站设计公司行业资讯频道！

另外有需要云服务器可以了解下创新互联scvps.cn，海内外云服务器15元起步，三天无理由+7*72小时售后在线，公司持有idc许可证，提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案，具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势，专为企业上云打造定制，能够满足用户丰富、多元化的应用场景需求。

新闻名称：Html5中prefetch和prerender有什么用-创新互联
网站链接：http://cxhlcq.cn/article/dcdpsg.html