css - 页面加载后加载 bootstrap css

Question

Google PageSpeed insights 建议删除渲染阻塞 css:

https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css

实现这一点意味着从 Bootstrap 样式规则中挑选出足够多的片段来呈现首屏内容，然后在页面加载后链接 Bootstrap css 文件。

工作量很大，但可行(我想)。

但是，在页面加载后链接 Bootstrap css 时，所有对 Bootstrap 规则的内联覆盖都将丢失。

如有任何想法，我们将不胜感激。

大卫

Answer 1

我会在页面内容之后使用 JS 从 CDN 加载 Bootstrap ，然后使用这个在线工具提取关键路径 CSS: https://jonassebastianohlsson.com/criticalpathcssgenerator/(或者您可以在本地使用与 Node 或 PhantomJS 相同的工具:https://github.com/pocketjoso/penthouse)

提取的 CSS 将被最小化并放置在您的标题中。