屏幕顯示圖像的原理
CRT的電子槍按上圖，從上到下一行一行掃描，掃描到底部的時候代表一幀結(jié)束。為了把視頻控制器與顯示器的顯示過程同步，顯示器（硬件）會發(fā)送一系列的時鐘信號。水平同步信號（HSync），根據(jù)這個信號掃描每一行。垂直同步信號（VSync），根據(jù)這個信號掃描下一幀。
CPU，GPU和顯示器會按照上圖的流程協(xié)同工作。CPU計算好內(nèi)容，CPU渲染結(jié)果給到幀緩沖器，視頻控制器根據(jù)時鐘信號從FrameBuffer中讀取每一幀內(nèi)容，經(jīng)過數(shù)模轉(zhuǎn)換給到顯示器顯示。
FrameBuffer只有一個的時候，幀的讀取和刷新都有一定的性能問題。所以一般會增加FrameBuffer數(shù)量。CPU和GPU把下一幀的內(nèi)容提前渲染好放到另一個FrameBuffer，GPU 會直接把視頻控制器的指針指向該FrameBuffer，從而提高性能。
但引入了新問題，假如當(dāng)前FrameBuffer的內(nèi)容，顯示器還沒讀取完畢，這時候切換FrameBuffer，就會渲染下一幀的內(nèi)容，導(dǎo)致畫面斷層撕裂。為了解決這個問題，GPU引入了垂直同步機制（V-Sync），當(dāng)開啟垂直同步后，GPU會等待顯示器的VSync信號發(fā)出，才會渲染下一幀內(nèi)容和刷新FrameBuffer，使得畫面更加流暢。
在iOS平臺，顯示渲染的核心是CoreAnimation。Core Animation是依賴于OpenGL/Metal做GPU渲染，CoreGraphics做CPU渲染。
CoreAnimation會在Runloop的beforeWaiting和exit時機注冊監(jiān)聽。當(dāng)一個事件到來，比如觸摸事件，導(dǎo)致界面發(fā)生變化，會進(jìn)行可能的UI組建創(chuàng)建，布局計算，調(diào)整視圖層級，調(diào)整視圖屬性等，這些變化會被CALayer捕捉到，并通過CATranscation提交到一個中間狀態(tài)去。等待Runloop的通知發(fā)出后，通過IPC發(fā)送給RenderServer，解析視圖層級樹，生成繪制指令，再通過OpenGL或Metal驅(qū)動GPU進(jìn)行渲染，渲染結(jié)果放到FrameBuffer。再由顯示器發(fā)出的VSync信號進(jìn)行新的一幀的顯示。
知道了成像的基本流程，接下來看下這過程關(guān)鍵組件所做的工作（CPU，GPU）。
CPU
視圖創(chuàng)建
屬性更改調(diào)整
布局計算
圖片解碼
繪制
GPU
圖形處理單元，負(fù)責(zé)對圖像的處理，采集圖片和形狀，運行變換，應(yīng)用紋理和混合，最終把它們輸送到屏幕上。
其實這個過程也可以用CPU完成，GPU誕生之前就是這樣做的。但是隨著圖像效果越來越復(fù)雜，CPU不堪重負(fù)，所以誕生了GPU。架構(gòu)與CPU基本相似，也是包含邏控制單元，寄存器，邏輯運算單元，但GPU有更多的運算單元，更適合做高并發(fā)的圖像操作，浮點運算，矩陣變換等。
一般應(yīng)用程序是通過OpenGL/Metal，驅(qū)動GPU渲染。OpenGL只是一套規(guī)范，并不是API，而驅(qū)動實現(xiàn)了這套規(guī)范，所以一般是硬件生產(chǎn)商產(chǎn)出。
GPU的處理本質(zhì)是矩陣變換，簡單概括可以為兩個步驟：1、把 3D 坐標(biāo)轉(zhuǎn)換為 2D 坐標(biāo)；2、把 2D 坐標(biāo)轉(zhuǎn)變?yōu)閷嶋H的有顏色的像素。
頂點著色器：頂點數(shù)據(jù)是一系列頂點的集合。頂點著色器主要的目的是把 3D 坐標(biāo)轉(zhuǎn)為另一種 3D 坐標(biāo)。
圖元裝配：根據(jù)頂點數(shù)據(jù)，作為輸入，把所有的點裝配成指定圖元的形狀
幾何著色器：可能變換成其它形狀的圖元
光柵化：將幾何信息轉(zhuǎn)換成一個個的柵格組成的圖像的過程。根據(jù)三角形頂點的位置，來確定需要多少個像素點才能構(gòu)成這個三角形
片段著色器：計算一個像素的最終顏色，上色
Alpha測試和混合(Blending)：檢測片段的對應(yīng)的深度（和模板(Stencil)）值，用它們來判斷這個像素是其它物體的前面還是后面，決定是否應(yīng)該丟棄。也會檢查alpha值并對物體進(jìn)行混合(Blend)。
