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 文件的下載和解析更加異步化，提高渲染性能。