关键渲染路径 Critical Rendering Path

词条 #234 / 700 · 第 5 章 · 5.2 网站性能、渲染路径与现代前端优化（226–240）

一句话定义

浏览器将 HTML、CSS、JS 转换为屏幕上像素的步骤序列。

打个比方 Analogy

做菜的关键步骤。少了哪步都不行：洗菜→切菜→炒菜→装盘。

优化：1) 减少关键资源数量（内联关键 CSS）；2) 减少关键资源大小（压缩）；3) 减少关键资源加载时间（预加载、CDN）。使用 rel="preload" 提前加载关键资源。

阻塞渲染的 CSS 和 JS 应放在 <head> 中，非关键的放在 </body> 前或使用 async/defer。