比如微博的這個加v認(rèn)證的圖標(biāo)
為什么不讓UI分成一批文件而是在用的時候再裁剪?
順便問一問在真正的開發(fā)中,手機(jī)端也會這么操作嗎?
資源體積小, 數(shù)量多. 如果分成一批文件的話, 網(wǎng)頁加載的時候會產(chǎn)生大量的 http 請求. http 請求的建立是需要消耗設(shè)備性能和網(wǎng)絡(luò)帶寬的.
與其說為什么不分成一批文件, 倒不如說是為了提升新能而把小文件整合在一起發(fā)布.
這是CSS雪碧圖效果.
原理: 將小圖標(biāo)和背景圖像合并到一張圖片上,然后利用css的背景定位來顯示需要顯示的圖片部分.
目的: 減少加載網(wǎng)頁圖片時對服務(wù)器的請求次數(shù),提高頁面的加載速度.
問題: 首次加載時, 內(nèi)存消耗比較大, 而且會把不需要用到的圖片或者圖標(biāo)也一起加載到內(nèi)存中.
手機(jī)端一般不用雪碧圖效果.
原因是手機(jī)內(nèi)存本來就不富裕, 手機(jī)端資源加載一般都是用到的時候在去加載到內(nèi)存中(lazy load), 而且使用雪碧圖會提高圖片維護(hù)成本, 在使用圖片時需要更多的css操作來顯示指定的圖片. 同時在iOS中, 使用雪碧圖也加大了不同的手機(jī)圖片適配難度.