欢迎光临
我们一直在努力

网站优化Preload进行预加载的使用方法

<link>元素的 rel 属性的属性值preload能够让HTML页面中 <head>元素内部书写一些声明式的资源获取请求,使得资源可以更早的得到加载。

在这里,我们会先加载和文件(但不会生效),在随后的页面渲染中,一旦需要使用它们,它们就会立即可用。


许多不同类型的内容都可以被预加载,一些主要可用的?属性值列举如下:

  • : 音频文件。
  • : 一个将要被嵌入到或内部的HTML文档。
  • : 一个将要被嵌入到元素内部的资源。
  • : 那些将要通过fetch和XHR请求来获取的资源,比如一个ArrayBuffer或JSON文件。
  • : 字体文件。
  • : 图片文件。
  • : 一个将会被嵌入到元素内的文件。
  • : JavaScript文件。
  • : 样式表。
  • : WebVTT文件。
  • : 一个JavaScript的web worker或shared worker。
  • : 视频文件。

元素有一个很棒的特性是它们能够接受一个作为属性值,这将令你能够使用响应式的预加载

通过添加支持跨域,对于字体文件是个特例,无论何时,字体文件都需要添加该属性

  • ?已经被许多浏览器支持了相当长的时间,它是意图预获取一些资源,以备下一个导航/页面使用。这很好,但对当前的页面并没有什么助益。此外,浏览器会给使用的资源一个相对较低的优先级——与使用的资源相比。
    查看Link prefetching FAQ可以了解更多细节。
赞(0)
未经允许不得转载:WP之家 » 网站优化Preload进行预加载的使用方法

登录

找回密码

注册