搜尋

首頁  >  問答  >  主體

前端 - 如何加速css background圖片的載入速度

我在我的一個頁面中,用了幾處css background設置為圖片的, 圖片大概就是幾十K這樣..
現在首次打開網頁時, 這幾處地方明顯加載慢, 看起來像是樣式全部加載完之後, 圖片才刷出來..
有什麼方法可以加快css加載; 或者說.讓這些圖片加載起來和看起來頁面同步一些,不會留著一些空白等待加載!
用的nginx,上了https和http2...
有什麼解決方案,不一定是加速.

滿天的星座滿天的星座2802 天前1294

全部回覆(6)我來回復

  • ringa_lee

    ringa_lee2017-06-06 18:14:13

    果斷就懶加載吧,簡單好用

    回覆
    0
  • 阿神

    阿神2017-06-06 09:56:29

    預先載入圖片,加入loading層,效能略為下降,但體驗好很多

    回覆
    0
  • 黄舟

    黄舟2017-06-06 09:56:29

    一個頁面用到多處可以先減少請求數先把圖片處理成一張sprite圖,然後再對圖片進行壓縮,其實還是具體問題具體分析,最好是可以看到比較具體的代碼

    回覆
    0
  • 習慣沉默

    習慣沉默2017-06-06 09:56:29

    靜態資源可以放到cdn上,圖片很大的話,建議預先載入或懶加載。懶加載時,建議用css提前佔位,以免造成不必要的reflow。另:圖片偏大的話,不建議使用雪碧圖。

    回覆
    0
  • 漂亮男人

    漂亮男人2017-06-06 09:56:29

    1.最懶的方法用lazyload

    回覆
    0
  • 大家讲道理

    大家讲道理2017-06-06 09:56:29

    首先 雪碧圖 自是不用說 當然 你也得看大小而定

    其次 看圖片所在的區域 如果有部分圖片不在即視區的話 可以使用懶加載

    如果以上條件都不滿足 就可以透過圖片壓縮 來減少圖片尺寸

    回覆
    0
  • 取消回覆