预加载preload应该怎么使用？

网上说：preload是用来预加载的，什么资源应该使用preload?
如果页面需要使用style.css来加载页面的整体样式，那么下面使用方法有什么区别（使用preload和正常引入有什么区别）？
提问时间：2023-05-13 19:29:30 编辑时间：2023-05-13 21:05:48 提问者： 小鲁
  • 默默
    10
    在Web开发中，预加载(preload)是在主资源加载时提前请求某些资源，以便在稍后的时间节省时间。在HTML链接(rel)属性中，可以使用preload指令指示在主文档加载时优先获取资源。具体方法如下：
    HTML preloading的语法如下：
    <link rel="preload" href="fonts/custom.ts-w0336-regular.woff2" as="font" type="font/woff2">
    您只需要将链接元素添加到页面头部，并设置as属性来指定资源类型，使浏览器可以开始预加载它们。
    as属性可以设置以下值：
    media
    script
    style
    font
    image
    例如，在一个包含多个图片的页面中，使用预加载可以加快页面加载。例如，您可以使用以下链接元素来预加载所有图片：
    <link rel="preload" href="image1.jpg" as="image">
<link rel="preload" href="image2.jpg" as="image">
<link rel="preload" href="image3.jpg" as="image">
    这样，浏览器就会在主资源加载时自动预加载这些图片，并在需要时加载它们，从而提高了Web应用程序的性能。
    回答时间：2023-05-13 19:33:51
  • 跑跑
    1
    style.css这样的样式文件，正常引入只会在浏览器解析到link标签时才开始加载，而使用preload则可以在页面开始渲染前预加载该资源，这样就可以提升一些用户体验，至于提升多少就不一定了 毕竟现在的网络与硬件资源整体不错
    回答时间：2023-05-13 19:49:58
相关标签

python