合理组织HTML结构可使首屏绘制(FCP)快120ms以上;DOM深度超6层会触发解析截断,节点超1500个致交互延迟上升;语义标签提升匹配效率与无障碍支持;Flex/Grid可大幅减少嵌套层级。

合理组织 HTML 结构能直接让首屏绘制(FCP)快 120ms 以上,不是理论值,是实测数据——某后台页删掉 3 层嵌套 <div class="wrapper"><div class="inner"><div class="content">,FCP 从 1.38s 降到 1.26s。
<h3>DOM 节点深度超 6 层会触发解析截断</h3>
<p>浏览器流式解析 HTML,每层嵌套都要创建节点、计算样式、检查布局。深度超过 6,低端安卓机或弱网下可能直接终止后续解析——你写的 <code><footer></footer> 或



















