浏览器解析HTML时，仅（媒体查询匹配时）和同步会阻塞解析；其他资源如、均不中断parser，而CSS响应头Content-Type错误也会导致CSSOM构建失败。
HTML 模板的加载顺序不是“按标签写在哪儿就从哪儿开始执行”，而是由浏览器解析器驱动的一套严格时序规则——关键在于哪些资源会阻塞 HTML 解析、哪些会阻塞渲染树构建、哪些会被浏览器主动忽略或降级。搞错这个顺序，defer 会失效，preload 反而拖慢首屏，内联 <style></style> 也可能白费。
浏览器解析 HTML 时，哪些标签会暂停解析？
只有两类标签会真正中断 HTML 解析流程：<link rel="stylesheet">（匹配当前媒体查询时）和同步 <script></script>（无 async/defer）。其他如 <img alt="什么是HTML模板的加载顺序_页面性能快速优化点【底层】" >、<iframe></iframe>、甚至 <link rel="preload"> 都不会打断 parser。
-
<link rel="stylesheet" media="print">不阻塞：浏览器异步下载，不参与 CSSOM 构建，直到 JS 显式改media -
<link rel="stylesheet" media="(min-width: 768px)">在小屏设备上也不阻塞——匹配失败即跳过 -
<script src="a.js"></script>放在顶部？解析立刻停住，等下载+执行完才继续 -
<script>console.log('inline');</script>同样阻塞，哪怕没 src
为什么把 script 放在 前还是可能白屏？
因为白屏的根源不是“脚本位置”，而是“脚本执行时机是否早于首屏 DOM 就绪”。即使 <script></script> 在
