如何提升瀏覽器CSS的網路效能？ – csswizardry

發表於2021-01-25
瀏覽器CSS

總結用於載入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”，並允許進行漸進式渲染。

更詳細案例點選標題進入原文

 

相關文章