9、Css下载的过程会阻塞js的下载吗？为什么阻塞？ · 大厂前端面试真题

>[danger]Css下载的过程会阻塞js的下载吗？为什么阻塞？ CSS 的下载过程会阻塞 JavaScript 的下载，这是因为在浏览器渲染页面时，DOM 和 CSSOM 是并行构建的，即在构建 DOM 树的同时也在构建 CSSOM 树。而 JavaScript 的执行是会阻塞 DOM 的构建的，因为 JavaScript 可能会修改 DOM 结构，如果 JavaScript 在 DOM 未构建完成前就开始执行，就有可能导致操作无效。因此，在浏览器下载和解析 HTML 时，它遇到了一个外部的 CSS 文件，它必须先下载并解析该文件，生成 CSSOM 树，然后才能继续构建 DOM 树。如果该 CSS 文件很大或者服务器响应时间很长，那么浏览器就必须等待 CSS 文件下载完毕后才能继续进行下一步 DOM 树的构建，从而导致 JavaScript 也被阻塞。为了避免这种情况，可以采取以下措施： - 将 CSS 文件放在 `<head>` 标签内，这样可以尽早地开始下载 CSS 文件； - 将 JavaScript 文件放在 `<body>` 标签的底部，这样可以确保 DOM 已经构建完成； - 使用异步加载（async）或延迟加载（defer）标记来加载 JavaScript 文件，这样可以使得 JavaScript 和 CSS 文件的下载和解析更加异步化，提高渲染性能。