W3c增加HTML5两个新元素lazyload和postpone

13-10-24 banq
         

W3c Resource Priorities为Html增加了两个重要资源属性:lazyload和postpone。

1. lazyload懒加载:一个资源必须等待其他没有标识lazyload的开始下载以后才能下载。

如下例子:

<!DOCTYPE html>
<html>
 <head>
     <link rel="stylesheet" type="text/css"  />
     <link rel="stylesheet" type="text/css"  lazyload />
 </head>
 <body>
    <img id="Logo" />
    <img id="Header" />
    <img id="AdditionalImages1"  lazyload />
    <img id="AdditionalImages2"  lazyload />
    <video id="MainContent"><source ></video>
    
    </script >
 </body>
</html>
<p>

该元素用来对一些大的文件如图片 视频等等加载有性能优化作用。

除了这种Pre-loading 其他优化还有 Pre-fetching:

<link rel="dns-prefetch" href="other.hostname.com">

<link rel="subresource" href="/some_other_resource.js">

<link rel="prefetch" href="/some_other_resource.jpeg">

<link rel="prerender" href="//domain.com/next_page.html">

2.postpone延缓:一个资源直到要显示给用户时才可以下载。适合图片 视频等元素。

[该贴被banq于2013-10-24 10:51修改过]

[该贴被banq于2013-10-24 10:51修改过]

[该贴被admin于2013-11-20 12:18修改过]