如何提升浏览器CSS的网络性能? – csswizardry


总结用于加载CSS的最佳网络性能做法:

  • 延迟加载Start Render不需要的任何CSS:
    • 这可能是关键CSS;
    • 或将CSS分成依据媒体Media不同的文件。
  • 避免@import:
    • 在您所有的HTML中;
    • 特别是在CSS中;
    • 并当心Preload Scanner预加载扫描仪的怪事。
  • 注意同步CSS和JavaScript的顺序:
    • CSS之后加载JavaScript在CSSOM完成之前不会运行。
    • 因此,如果您的JavaScript不依赖于CSS,
      • 在CSS之前加载它;
    • 但如果确实取决于您的CSS:
      • 在CSS之后加载它。
  • 根据DOM需要加载CSS:
    • 这将不会阻塞“Start Render”,并允许进行渐进式渲染。

更详细案例点击标题进入原文