2019 iOS面試題---UI相關:事件傳遞,圖像顯示,性能優化,離屏渲染

2019 iOS面試題大全---全方面剖析面試
  • UIView與CALayer
  • 事件傳遞與視圖響應鏈
  • 圖像顯示原理
  • UI卡頓掉幀原因
  • 滑動優化方案
  • UI繪制原理
  • 離屏渲染

一、UIView與CALayer

0C9E738E-48C6-4960-BAC5-0FC23F0DB3C8.png

<單一職責原則>
UIView為CALayer提供內容,以及負責處理觸摸等事件,參與響應鏈
CALayer負責顯示內容contents

二、事件傳遞與視圖響應鏈 :

- (UIView *)hitTest:(CGPoint)point withEvent:(UIEvent *)event;

- (BOOL)pointInside:(CGPoint)point withEvent:(UIEvent *)event;
image.png
image.png

如果事件一直傳遞到UIAppliction還是沒處理,那就會忽略掉

三、圖像顯示原理

image.png

1.CPU:輸出位圖
2.GPU :圖層渲染,紋理合成
3.把結果放到幀緩沖區(frame buffer)中
4.再由視頻控制器根據vsync信號在指定時間之前去提取幀緩沖區的屏幕顯示內容
5.顯示到屏幕上


image.png

CPU工作
1.Layout: UI布局,文本計算
2.Display: 繪制
3.Prepare: 圖片解碼
4.Commit:提交位圖

GPU渲染管線(OpenGL)
頂點著色,圖元裝配,光柵化,片段著色,片段處理

四、UI卡頓掉幀原因

image.png

iOS設備的硬件時鐘會發出Vsync(垂直同步信號),然后App的CPU會去計算屏幕要顯示的內容,之后將計算好的內容提交到GPU去渲染。隨后,GPU將渲染結果提交到幀緩沖區,等到下一個VSync到來時將緩沖區的幀顯示到屏幕上。也就是說,一幀的顯示是由CPU和GPU共同決定的。
一般來說,頁面滑動流暢是60fps,也就是1s有60幀更新,即每隔16.7ms就要產生一幀畫面,而如果CPU和GPU加起來的處理時間超過了16.7ms,就會造成掉幀甚至卡頓。

五、滑動優化方案
CPU:把以下操作放在子線程中
1.對象創建、調整、銷毀
2.預排版(布局計算、文本計算、緩存高度等等)
3.預渲染(文本等異步繪制,圖片解碼等)

GPU:
紋理渲染,視圖混合

一般遇到性能問題時,考慮以下問題:
是否受到CPU或者GPU的限制?
是否有不必要的CPU渲染?
是否有太多的離屏渲染操作?
是否有太多的圖層混合操作?
是否有奇怪的圖片格式或者尺寸?
是否涉及到昂貴的view或者效果?
view的層次結構是否合理?

六、UI繪制原理

image.png

image.png

異步繪制:
[self.layer.delegate displayLayer: ]
代理負責生成對應的bitmap
設置該bitmap作為該layer.contents屬性的值

image.png

七、離屏渲染

On-Screen Rendering:當前屏幕渲染,指的是GPU的渲染操作是在當前用于顯示的屏幕緩沖區中進行
Off-Screen Rendering:離屏渲染,分為CPU離屏渲染和GPU離屏渲染兩種形式。GPU離屏渲染指的是GPU在當前屏幕緩沖區外新開辟一個緩沖區進行渲染操作
應當盡量避免的則是GPU離屏渲染

GPU離屏渲染何時會觸發呢?
圓角(當和maskToBounds一起使用時)、圖層蒙版、陰影,設置

layer.shouldRasterize = YES

為什么要避免GPU離屏渲染?
GPU需要做額外的渲染操作。通常GPU在做渲染的時候是很快的,但是涉及到offscreen-render的時候情況就可能有些不同,因為需要額外開辟一個新的緩沖區進行渲染,然后繪制到當前屏幕的過程需要做onscreen跟offscreen上下文之間的切換,這個過程的消耗會比較昂貴,涉及到OpenGL的pipeline跟barrier,而且offscreen-render在每一幀都會涉及到,因此處理不當肯定會對性能產生一定的影響。另外由于離屏渲染會增加GPU的工作量,可能會導致CPU+GPU的處理時間超出16.7ms,導致掉幀卡頓。所以可以的話應盡量減少offscreen-render的圖層

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 227,797評論 6 531
  • 序言:濱河連續發生了三起死亡事件,死亡現場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發現死者居然都...
    沈念sama閱讀 98,179評論 3 414
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 175,628評論 0 373
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 62,642評論 1 309
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 71,444評論 6 405
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發上,一...
    開封第一講書人閱讀 54,948評論 1 321
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 43,040評論 3 440
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 42,185評論 0 287
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當地人在樹林里發現了一具尸體,經...
    沈念sama閱讀 48,717評論 1 333
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 40,602評論 3 354
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發現自己被綠了。 大學時的朋友給我發了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 42,794評論 1 369
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 38,316評論 5 358
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質發生泄漏。R本人自食惡果不足惜,卻給世界環境...
    茶點故事閱讀 44,045評論 3 347
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 34,418評論 0 26
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 35,671評論 1 281
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 51,414評論 3 390
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 47,750評論 2 370

推薦閱讀更多精彩內容