解決View Layer圓角卡頓的問題

使用layer繪制圓角的時(shí)候回造成界面滑動(dòng)的時(shí)候卡頓志鹃,主要是:

原理

上面拖慢幀率的原因其實(shí)都是Off-Screen Rendering(離屏渲染)的原因泽西。離屏渲染是個(gè)好東西,但是頻繁發(fā)生離屏渲染是非常耗時(shí)的尝苇。

Off-Screen Rendering

離屏渲染,指的是GPU在當(dāng)前屏幕緩沖區(qū)以外新開辟一個(gè)緩沖區(qū)進(jìn)行渲染操作淳玩。由上面的一個(gè)結(jié)論視圖和圓角的大小對(duì)幀率并沒有什么卵影響非竿,數(shù)量才是傷害的核心輸出啊『熘可以知道離屏渲染耗時(shí)是發(fā)生在離屏這個(gè)動(dòng)作上面,而不是渲染韧骗。為什么離屏這么耗時(shí)零聚?原因主要有創(chuàng)建緩沖區(qū)和上下文切換。創(chuàng)建新的緩沖區(qū)代價(jià)都不算大隶症,付出最大代價(jià)的是上下文切換。

上下文切換

上下文切換淋样,不管是在GPU渲染過程中胁住,還是一直所熟悉的進(jìn)程切換刊咳,上下文切換在哪里都是一個(gè)相當(dāng)耗時(shí)的操作儡司。首先我要保存當(dāng)前屏幕渲染環(huán)境,然后切換到一個(gè)新的繪制環(huán)境枫慷,申請(qǐng)繪制資源浪规,初始化環(huán)境,然后開始一個(gè)繪制誉裆,繪制完畢后銷毀這個(gè)繪制環(huán)境缸濒,如需要切換到On-Screen Rendering或者再開始一個(gè)新的離屏渲染重復(fù)之前的操作。 下圖描述了一次mask的渲染操作庇配。

一次mask發(fā)生了兩次離屏渲染和一次主屏渲染。即使忽略昂貴的上下文切換耀鸦,一次mask需要渲染三次才能在屏幕上顯示啸澡,這已經(jīng)是普通視圖顯示3陪耗時(shí),若再加上下文環(huán)境切換嗅虏,一次mask就是普通渲染的30倍以上耗時(shí)操作。問我這個(gè)30倍以上這個(gè)數(shù)據(jù)怎么的出來(lái)的楞艾?當(dāng)我在cell的UIImageView的實(shí)例增加到150個(gè)冰更,并去掉圓角的時(shí)候,幀數(shù)才跌至28幀每秒蜀细。雖然不是甚準(zhǔn)確,但至少反映mask這個(gè)耗時(shí)是無(wú)mask操作的耗時(shí)的數(shù)十倍的谆刨。

應(yīng)對(duì)

那么如何應(yīng)對(duì)這個(gè)問題呢?不要在滾動(dòng)視圖使用cornerRadius或者mask痊夭。如果你非要作死怎么辦呢?那么這樣也可以拯救你:

self.layer.shouldRasterize=YES;

self.layer.rasterizationScale= [UIScreen mainScreen].scale;

比如我用collectionview做瀑布流虹曙,每一個(gè)item都是一個(gè)圓角照片番舆,即使我們使用了collectionview的重用機(jī)制,也會(huì)出現(xiàn)卡頓現(xiàn)象(雖然在6s上不是很明顯)恨狈,如果重用你都不用的的話,那么真的是沒法用了返奉。但是你如果加上rasterization的話吗氏,就會(huì)好很多的,不信可以試一下弦讽,效果很明顯。

這樣大部分情況下可以馬上挽救你的幀數(shù)在55幀每秒以上十厢。shouldRasterize = YES會(huì)使視圖渲染內(nèi)容被緩存起來(lái)捂齐,下次繪制的時(shí)候可以直接顯示緩存,當(dāng)然要在視圖內(nèi)容不改變的情況下奠宜。

除了上面非要作死的人外,大家還是采取預(yù)先生成圓角圖片娩嚼,并緩存起來(lái)這個(gè)方法才是比較好的手段滴肿。預(yù)處理圓角圖片可以在后臺(tái)處理,處理完畢后緩存起來(lái),再在主線程顯示呵俏,這就避免了不必要的離屏渲染了滔灶。

另外也有在圖片上面覆蓋一個(gè)鏤空?qǐng)A形圖片的方法可以實(shí)現(xiàn)圓形頭像效果,這個(gè)也是極為高效的方法录平。缺點(diǎn)就是對(duì)視圖的背景有要求,單色背景效果就最為理想绪氛。

總結(jié)

實(shí)現(xiàn)圓角cornerRadius要比mask高效很多涝影。

Rasterize在大部分情況下極大減少GPU工作争占。在有空間的情況下,大部分情況下緩存總能幫到你臂痕,不是嗎?

后臺(tái)預(yù)處理圖片也能很簡(jiǎn)單幫上你很大的忙姆怪。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末澡绩,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子肥卡,更是在濱河造成了極大的恐慌,老刑警劉巖揪胃,帶你破解...
    沈念sama閱讀 219,539評(píng)論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件喊递,死亡現(xiàn)場(chǎng)離奇詭異,居然都是意外死亡骚勘,警方通過查閱死者的電腦和手機(jī)撮奏,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,594評(píng)論 3 396
  • 文/潘曉璐 我一進(jìn)店門盛杰,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)藐石,“玉大人,你說我怎么就攤上這事逗嫡≈暌溃” “怎么了?”我有些...
    開封第一講書人閱讀 165,871評(píng)論 0 356
  • 文/不壞的土叔 我叫張陵恋腕,是天一觀的道長(zhǎng)抹锄。 經(jīng)常有香客問我,道長(zhǎng)荠藤,這世上最難降的妖魔是什么伙单? 我笑而不...
    開封第一講書人閱讀 58,963評(píng)論 1 295
  • 正文 為了忘掉前任,我火速辦了婚禮哈肖,結(jié)果婚禮上吻育,老公的妹妹穿的比我還像新娘。我一直安慰自己淤井,他們只是感情好布疼,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,984評(píng)論 6 393
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著币狠,像睡著了一般游两。 火紅的嫁衣襯著肌膚如雪漩绵。 梳的紋絲不亂的頭發(fā)上器罐,一...
    開封第一講書人閱讀 51,763評(píng)論 1 307
  • 那天,我揣著相機(jī)與錄音渐行,去河邊找鬼轰坊。 笑死,一個(gè)胖子當(dāng)著我的面吹牛祟印,可吹牛的內(nèi)容都是我干的肴沫。 我是一名探鬼主播,決...
    沈念sama閱讀 40,468評(píng)論 3 420
  • 文/蒼蘭香墨 我猛地睜開眼蕴忆,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼颤芬!你這毒婦竟也來(lái)了?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,357評(píng)論 0 276
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤站蝠,失蹤者是張志新(化名)和其女友劉穎汰具,沒想到半個(gè)月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體菱魔,經(jīng)...
    沈念sama閱讀 45,850評(píng)論 1 317
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡留荔,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,002評(píng)論 3 338
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了澜倦。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片聚蝶。...
    茶點(diǎn)故事閱讀 40,144評(píng)論 1 351
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖藻治,靈堂內(nèi)的尸體忽然破棺而出碘勉,到底是詐尸還是另有隱情,我是刑警寧澤桩卵,帶...
    沈念sama閱讀 35,823評(píng)論 5 346
  • 正文 年R本政府宣布验靡,位于F島的核電站,受9級(jí)特大地震影響雏节,放射性物質(zhì)發(fā)生泄漏胜嗓。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,483評(píng)論 3 331
  • 文/蒙蒙 一矾屯、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧初厚,春花似錦件蚕、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,026評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至亚情,卻和暖如春妄痪,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背楞件。 一陣腳步聲響...
    開封第一講書人閱讀 33,150評(píng)論 1 272
  • 我被黑心中介騙來(lái)泰國(guó)打工衫生, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人土浸。 一個(gè)月前我還...
    沈念sama閱讀 48,415評(píng)論 3 373
  • 正文 我出身青樓罪针,卻偏偏與公主長(zhǎng)得像,于是被迫代替她去往敵國(guó)和親黄伊。 傳聞我的和親對(duì)象是個(gè)殘疾皇子泪酱,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,092評(píng)論 2 355

推薦閱讀更多精彩內(nèi)容