老实说，这个link标签算是用的比较多了，最常见的就是用来引入外部的CSS样式表，所以对它并不陌生，但是对于它的preload(预加载)和as(当作)属性就相对来说就不是很熟悉了，preload倒是有见到过，但是as就基本没见到过，算是第一次见吧，要不是这次在研究通过百度快照来看网页进行跳转功能，那这个新的知识点就get不到喽。
所以，折腾有折腾的好处，缺点就是有时候太费时间了，就是总想把知识点都吃透了（强迫症），可明知道有些知识点就是没有办法一次性吃透，就要强迫着自己，这不是很难受吗？呜呜呜呜呜，强迫症，我错了。
回到本文的话题。
preload (预加载)
就是有些资源需要在页面加载完成后即刻需要的，那么对于这种即刻需要的资源，会希望在页面一加载的时候就先开始获取，然后在浏览器的主渲染机制介入前就进行预加载，这样的好处就可以使得资源可以更早的得到加载并可用且更不易阻塞页面的初步渲染，进而提升性能。
相关的实例代码，如下：
<!DOCTYPE html>
<html lang="en">
<head>
<title>link标签的preload和as属性</title>
<link rel="preload" href="main.js" as="script" />
</head>
<body>
<script src="main.js"></script>
</body>
</html>
更多的时候，我们会把preload和as一起搭配使用，就向上面的例子一样。
as(当作)
注意了，这个as属性是处在实验中，所以兼容性不是很好，大家如果有在使用的话，一定要注意这方面的问题，具体啥时候可以完全兼容可以看这篇文档：https://developer.mozilla.org/en-US/docs/Web/API/HTMLLinkElement/as
它的值有这几种：script、style、image、video、audio、track、font、fetch