浏览器解析HTML是单线程、自上而下、同步构建DOM树的过程，轻量引擎对冗余结构、深层嵌套和阻塞资源尤其敏感；应保持DOM扁平、语义明确、无等待依赖，减少无意义div嵌套，关键CSS内联，脚本置底部或加defer/async，图片和iframe启用lazy加载。
浏览器解析 HTML 是单线程、自上而下、同步构建 DOM 树的过程，所谓“轻量引擎”（比如低端 Android WebView、旧版 Safari、嵌入式设备上的渲染器）对冗余结构、深层嵌套和阻塞资源尤其敏感。想让它解析快，核心就一条：**让 DOM 树扁平、语义明确、无等待依赖**。
减少 DOM 节点数量，特别是无意义的 <div> 嵌套
<p>每多一层 <code><div class="wrapper"><div class="inner"><div class="content">，浏览器就要多创建一个节点、多做一次样式计算、多走一次 layout 流程。在旧 WebView 中，5 层以上嵌套可能直接拖慢首屏 200ms+。
<ul><li>用 <code><header></header>、<nav></nav>、<main></main>、<section></section> 替代连续三层 <div>
<li>检查 Chrome DevTools 的 Elements 面板，看是否有连续 3 层以上纯容器 <code><div>（无 class、无 id、无子内容逻辑）
<li>Flexbox 或 Grid 布局能天然压平结构，比如用 <code>display: grid 实现栅格，就不用 <div class="row"><div class="col"> 套两层
<h3>避免阻塞型资源打断 HTML 解析流</h3>
<p>浏览器遇到 <code><script src="..."></script> 或未加 media 的 <link rel="stylesheet">，会立刻暂停 HTML 解析，去下载执行——DOM 构建直接卡住。这对轻量引擎影响更大，因为它们网络栈和 JS 引擎更弱。
- 所有非必要脚本统一移到
