将CSS添加到JavaScript文件并动态加载到HTML头标记是否性能有效？

Question

如果在网站中，我在正文末尾添加了一个JavaScript，并为该JavaScript添加了大量的CSS，当页面加载并解析我的JavaScript文件时，动态地将其添加到HTML页面的头部，当文件驻留在HTML页面的末尾时，在加载整个页面后，这会减慢页面的速度吗？

因为我的CSS代码超过1000行（未经过管理）而且由于某些原因我不想要外部CSS（虽然它已被缓存）。

Answer 1

没有。它不会减慢页面速度，因为该页面基本上已完成加载所有HTML和其他CSS。

当正在下载HTML和CSS时，浏览器构建DOM模型和CSSOM。到达您的脚本时，最后，除了您最后使用javascript添加的内容之外，它们大部分都是完整的。

我从重新阅读你的问题收集到的是你打算通过在页面末尾运行的javascript加载所有CSS。可能与您有关的问题是您添加的CSS将开始修改页面。潜在的问题可能是你的页面有点跳跃，闪烁颜色，更改字体等等，这取决于你添加的CSS的作用。