页面优化---preload

关于preLoad的使用:
    参考:http://mp.weixin.qq.com/s/IUDI0Xm2q0bjVXZVxzp_jQ
    定义:什么是preLoad
        一种声明式的命令,让浏览器提前加载指定的资源
        但是,并不会执行,需要的时候,再执行
    作用:
        1.将加载和执行分离,可不阻塞渲染
            不阻塞document的onLoad事件
        2.提前加载资源,
            解决以来的font字体,过一段事件才会刷新出来..
    如何使用preLoad:
        1.使用link的方式创建
            <link rel="preload" href="...css" as="style">
            <link rel="preload" href="...woff" as="font">
            <link rel="preload" href="...js" as="script">
        2.或者可以使用js 来创建标签
        3.使用http响应头的link字段创建
            Link:<https://....css>;rel=preload;as=style
    preLoad和profetch的区别:
        1.preLoad:
            浏览器必须要加载的资源,浏览器一定会加载的...
        2.prefetch :
            浏览器可能加载的资源,浏览器不一定会加载的...
    使用的时候需要注意:
        1.preLoad 资源加载提前,如字体必须要使用的
            避免滥用,尤其是移动端
        2.prefetch
            预测资源,用户滚动的时候,拉去下一屏幕的组件
            预测用户的动作
        3.跨域加载资源的时候:
            不许加crossorigin:
            代码:
                <link rel="preload" as="font" crossorigin href="...woff">
                
        4.不同资源加载的时候:
            网络的优先级,需要注意一下的...