应该始终让 CSS 优先于 JavaScript 吗?
传统观念:
长期以来,一种普遍的建议是将 CSS 放在 JavaScript 之前,理由是:
- 渲染线程需要呈现页面的所有样式信息。
- 如果 JavaScript 包含在前面,JavaScript 引擎必须先解析所有内容,然后再继续执行下一组资源。
- 这意味着渲染线程无法完全显示页面,因为它没有所需的所有样式。
实际测试:
然而,实际测试表明了截然不同的结果:
- JavaScript 不会开始执行,直到所有 CSS 都下载完毕。
- 因此,将 JavaScript 包含在前面似乎更有效,因为 JavaScript 线程可以运行更长的时间。
结论:
-
对于桌面浏览器:在现代浏览器中,将 CSS 放在 JavaScript 之前 不会带来性能提升。在某些情况下,甚至会导致性能下降(例如 CSS 延迟时)。因此,您应该在 JavaScript 之后**链接到外部样式表。
-
对于移动浏览器:证据表明,一些移动浏览器(例如 Android 版的 WebKit)仍然不会进行预测性解析。在这类浏览器上,将脚本放在 CSS 之前可能会造成性能损失。
技术解释: