UI渲染及顯示原理

一、iOS頁面UI渲染其實是由CPU和GPU同時協(xié)作完成的。

CPU工作是進行UI計算,文本處理,圖片轉(zhuǎn)碼等操作;GPU接著做下面的工作渲染管線用OPENGL渲染到當前頁面視圖上;在iOS設備時鐘周期內(nèi)完成計算和渲染。

iOS設備的硬件時鐘周期是每秒60,即要求開發(fā)中每一幀的UI繪制不超過1s/60,一旦超過這個時間,即UI繪制顯示延遲,滑動頁面時就會給我們卡頓的感覺。

了解了上面的概念,我們應該能想到一些針對開發(fā)中遇到的卡頓優(yōu)化措施

基于CPU的優(yōu)化,把如下耗時操作在子線程中進行,避免在主線程中造成滾動中UI渲染CPU的延遲:

布局計算,高度緩存,文字計算,圖片的解碼,文本的預繪制,對象的創(chuàng)建、修改,銷毀等。

基于GPU的優(yōu)化,盡量少用離屏渲染,盡量少對view設置透明度操作,盡量減少view層次結(jié)構,盡量少用圖層混合,是否圖片大小不合適等方面

二、順便查了下屏幕渲染,分為三種

1、離屏渲染(Off-Screen Rendering):就是GPU在當前屏幕以外開辟一個另外的緩沖區(qū)進行渲染操作。

2、當前屏幕渲染(On-Screen Rendering):指的是GPU是在當前顯示的屏幕緩沖區(qū)進行的渲染操作。

3、CPU的離屏渲染:即非GPU渲染,如果重寫了drawReact,并且使用Core Graphics技術進行了繪制操作,就涉及到了這個技術,整個過程由CPU在APP中同步完成,渲染得到bitmap后再交給GPU進行渲染顯示。

為什么離屏渲染會耗性能?當使用遮罩,圓角,陰影的時候,圖層屬性的混合體被指定為在預合成之前是不能直接在屏幕中進行繪制的,所以就需要屏幕外渲染被喚起,就意味著圖層在顯示之前必須在一個屏幕外的上下文中被渲染,而這個屏幕外渲染緩沖區(qū)上下文和當前屏幕渲染緩沖區(qū)上下文之間的切換非常耗性能。

離屏渲染可以在Instruments的Core Animation工具中有幾個和離屏渲染相關的檢查選項:

? · ? Color Offscreen-Rendered Yellow

開啟后會把那些需要離屏渲染的圖層高亮成黃色,這就意味著黃色圖層可能存在性能問題。

? · ? Color Hits Green and Misses Red

三、渲染抉擇

能用當前屏幕渲染就用當前屏幕渲染,不得已使用離屏渲染的時候,需要明白CPU的浮點運算能力是不如GPU的,但是如果是比較簡單的效果實現(xiàn),CPU離屏渲染確是比較好的選擇,畢竟屏幕緩沖區(qū)的上下文切換是非常耗性能的。

?著作權歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容