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