as属性必须严格匹配资源类型，否则preload失效；importance仅Chromium支持且只影响fetch优先级，对字体渲染无直接作用。
as 属性必须写对，否则 rel="preload" 彻底失效
浏览器看到 rel="preload" 不会自动猜资源类型，as 是强制指令，不是提示。写错、漏写、或跟实际资源不匹配，请求压根不会发——控制台静默无日志，Network 面板里也找不到那条请求。
-
as="style"：只用于 CSS 文件（rel="stylesheet"引入的），不能写成as="stylesheet"或as="css" -
as="script"：适用于普通 JS 和type="module"脚本，但不能写as="javascript"或as="js" -
as="font"：仅限 WOFF/WOFF2/TTF 字体，且必须带crossorigin（无值），否则触发 CORS 失败且无 fallback -
as="image"：支持 JPEG/PNG/WebP/AVIF/SVG，但不覆盖<video poster>里的图片——那种得靠<img>或fetch()预加载 -
as="fetch"：用于关键 JSON（如配置、用户信息），默认带凭据；跨域时需配crossorigin="anonymous"，不能用use-credentials
importance 属性目前只有 Chrome 支持，且仅影响 fetch 优先级
importance 不是通用调度开关，它只在 Chromium 内核中生效，且只作用于 fetch() 和 <link rel="preload"> 的网络请求优先级，对渲染、解析、执行阶段无影响。Firefox 和 Safari 完全忽略该属性。
- 可选值为
"high"、"low"、"auto"（默认） -
importance="high"会让预加载请求排到队列最前，但无法绕过 HTTP/2 流优先级或服务端限流 - 搭配
as="script"或as="fetch"时效果较明显；对as="font"几乎无效（字体加载由独立 font loader 管理） - 别指望它“加速字体渲染”——FOIT/FOUT 行为仍由
@font-face的font-display控制
as 和 importance 组合使用时的典型错误
很多人以为加了 importance="high" 就能“强制提前加载字体”，结果发现页面还是白屏等字。根本原因在于：字体预加载依赖两个条件同时满足，缺一不可。
- 漏写
crossorigin：哪怕写了as="font"和importance="high"，没crossorigin就等于没写，CORS 请求失败后浏览器不会降级重试 - as 类型与资源实际 MIME 不符：比如把 SVG 当
as="image"加载没问题，但若误标为as="script"，Chrome 会拒绝解析并报MIME type mismatch - importance 在非 Chromium 浏览器中被完全忽略，而开发者只在 Chrome 里验证，上线后其他用户看不到任何效果
- 把
importance="high"加在rel="prefetch"上——该属性对 prefetch 无效，只对 preload 和 fetch 生效
真正影响字体渲染体验的关键不在 as 或 importance
预加载本身只是让字体文件更早到达浏览器缓存，但是否显示、何时显示、是否阻塞文本，取决于后续链路。最容易被忽略的是这三处：
-
@font-face中必须声明font-display: swap（或optional），否则即使字体已缓存，浏览器仍可能等待加载完成才渲染文字 -
rel="preload"的href必须和@font-face的src完全一致（包括路径、查询参数、哈希），否则缓存不命中，预加载白做 - 字体文件若未启用压缩（如 Brotli）、或未转为 WOFF2 格式，体积过大，即便预加载了，下载耗时仍长，
importance对此毫无帮助
