析構(gòu)圖顯示：
圖像顯示各組件分工：
~ CPU：計(jì)算視圖frame右莱，圖片解碼，繪制紋理交給GPU氏堤。
~ GPU：紋理混合沙绝，頂點(diǎn)變換，渲染到幀緩沖區(qū)鼠锈。
~ 時(shí)鐘信號(hào)：垂直同步信號(hào)V-Sync / 水平同步信號(hào)H-Sync闪檬。
~ iOS設(shè)備雙緩沖機(jī)制：前/后幀緩沖區(qū)。
~ CRT：陰極電子槍發(fā)射電子购笆，在陰極高電壓的作用下粗悯，電子由電子槍射向熒光屏，使熒光粉發(fā)光同欠，將圖像顯示在屏幕上样傍。采用時(shí)鐘信號(hào)控制。
~ LCD：（光學(xué)成像原理）在不加電壓的情況下铺遂，光線會(huì)沿著液晶分子的間隙前進(jìn)旋轉(zhuǎn)90°衫哥，光可以通過。在 加入電壓后襟锐，光沿著液晶分子的間隙直線前進(jìn)撤逢，被濾光板擋住。
~ 注：LCD的成像原理與CRT截然不同粮坞，每一個(gè)像素的顏色在需要改變時(shí)才去改變電壓蚊荣，但扔需要按照一定的刷新頻率向GPU獲取新的圖像用于顯示。
圖像撕裂原因分析
?圖像撕裂：當(dāng)視頻控制器還未讀取完成時(shí)莫杈，GPU將新的一幀內(nèi)容提交到幀緩沖區(qū)并把兩個(gè)幀緩沖區(qū)進(jìn)行更新后互例，視頻控制器就會(huì)把新的一幀數(shù)據(jù)的下半段顯示到屏幕上，造成畫面撕裂的現(xiàn)象姓迅。
?解決方案：垂直同步機(jī)制
?弊端：GPU會(huì)等待顯示的V-Sync信號(hào)發(fā)出后敲霍，才進(jìn)行新的一幀渲染和緩存區(qū)更新。能解決畫面撕裂現(xiàn)象丁存，也增加了畫面流暢度肩杈，但需要消耗更多的計(jì)算資源，由此可能導(dǎo)致卡頓解寝。
離屏渲染與光柵化
?離屏渲染：CPU渲染及非GPU緩沖區(qū)的渲染統(tǒng)稱為離屏渲染扩然。
?離屏渲染的觸發(fā)：CoreGraphics的上下文繪制，drawRect繪制聋伦，layer圓角/邊框/陰影/抗鋸齒/光柵化（shouldRasterize置為YES）等夫偶。
?離屏渲染的檢測：Instruments的CoreAnimation工具動(dòng)態(tài)監(jiān)測界睁。（使用方法：Color Offscreen –Rendered Yellow ：開啟后會(huì)把那些需要離屏渲染的圖層高亮成黃色，黃色圖層可能存在性能問題兵拢。）
?光柵化簡介：隱式創(chuàng)建一個(gè)位圖翻斟，各種陰影遮罩等效果也會(huì)保存到位圖中緩存起來，從而減少渲染的頻度说铃，把GPU的操作轉(zhuǎn)到CPU上访惜，生成位圖緩存，直接讀取調(diào)用腻扇。（注：對(duì)于經(jīng)常變動(dòng)的內(nèi)容债热，不要開啟光柵化，防止性能浪費(fèi)幼苛，如Cell的復(fù)用）
?光柵化的檢測：Color Hits Green and Misses Red 開啟后窒篱，若shouldRasterize設(shè)置為YES，對(duì)應(yīng)的渲染結(jié)果會(huì)緩存舶沿，如果圖層是綠色墙杯，表示緩存被復(fù)用；如果是紅色暑椰，就表示緩存被重復(fù)創(chuàng)建霍转，可能存在性能問題。
?GPU緩存區(qū)渲染優(yōu)勢：為圖像顯示做了高度優(yōu)化一汽，速度較快。
卡頓原因分析
大體有三種原因：
1.UI渲染需要時(shí)間較長低滩，無法按時(shí)提交結(jié)果召夹。
2.一些需要密集計(jì)算的處理放在了主線程中執(zhí)行，導(dǎo)致主線程被阻塞恕沫，無法渲染UI界面监憎。
3.網(wǎng)絡(luò)請(qǐng)求由于網(wǎng)絡(luò)狀態(tài)的問題響應(yīng)較慢，UI層由于沒有模型返回?zé)o法渲染婶溯。
CPU資源消耗分析
1.對(duì)象創(chuàng)建：對(duì)象的創(chuàng)建會(huì)分配內(nèi)存鲸阔、調(diào)整屬性、甚至還有讀取文件等操作迄委，比較消耗CPU資源褐筛。盡量采取輕量級(jí)對(duì)象，盡量放到后臺(tái)線程處理叙身，盡量推遲對(duì)象的創(chuàng)建時(shí)間渔扎。（如UIView / CALayer）
2.對(duì)象調(diào)整：frame、bounds信轿、transform及視圖層次等屬性調(diào)整很耗費(fèi)CPU資源晃痴。盡量減少不必要屬性的修改残吩，盡量避免調(diào)整視圖層次、添加和移除視圖倘核。
3.布局計(jì)算：隨著視圖數(shù)量的增長泣侮，Autolayout帶來的CPU消耗會(huì)呈指數(shù)級(jí)增長，所以盡量提前算好布局紧唱，在需要時(shí)一次性調(diào)整好對(duì)應(yīng)屬性旁瘫。
4.文本渲染：屏幕上能看到的所有文本內(nèi)容控件，包括UIWebView琼蚯，在底層都是通過CoreText排版酬凳、繪制為位圖顯示的。常見的文本控件遭庶，其排版與繪制都是在主線程進(jìn)行的宁仔，顯示大量文本是，CPU壓力很大峦睡。對(duì)此解決方案唯一就是自定義文本控件翎苫，用CoreText對(duì)文本異步繪制。（很麻煩榨了，開發(fā)成本高）
5.圖片解碼：當(dāng)用UIImage或CGImageSource創(chuàng)建圖片時(shí)煎谍，圖片數(shù)據(jù)并不會(huì)立刻解碼。圖片設(shè)置到UIImageView或CALayer.contents中去龙屉，并且CALayer被提交到GPU前呐粘，CGImage中的數(shù)據(jù)才會(huì)得到解碼。這一步是發(fā)生在主線程的转捕，并且不可避免作岖。SD_WebImage處理方式：在后臺(tái)線程先把圖片繪制到CGBitmapContext中，然后從Bitmap直接創(chuàng)建圖片五芝。
6.圖像繪制：圖像的繪制通常是指用那些以CG開頭的方法把圖像繪制到畫布中痘儡，然后從畫布創(chuàng)建圖片并顯示的一個(gè)過程。CoreGraphics方法是線程安全的枢步，可以異步繪制沉删，主線程回調(diào)。
GPU資源消耗分析
?紋理混合：盡量減少短時(shí)間內(nèi)大量圖片的顯示醉途，盡可能將多張圖片合成一張進(jìn)行顯示矾瑰。
?視圖混合：盡量減少視圖層次和數(shù)量，并在不透明的視圖里標(biāo)明opaque屬性以避免無用的Alpha通道合成结蟋。
?圖形生成：盡量避免離屏渲染脯倚，盡量采用異步繪制，盡量避免使用圓角、陰影推正、遮罩等屬性恍涂。必要時(shí)用靜態(tài)圖片實(shí)現(xiàn)展示效果，也可嘗試光柵化緩存復(fù)用屬性植榕。
Instruments 卡頓監(jiān)測
Time Profiler ->Call Tree Options :
1.Separete By Thread :按線程劃分
2.Invert Call Tree ：逆向調(diào)用樹再沧，方便查看調(diào)用順序
3.Hide System Libraries：隱藏系統(tǒng)庫
Core Animation ->Debug Options :
1.Color Blended Layers :監(jiān)測圖層混合情況，沒有混合的部分為綠色尊残，混合最嚴(yán)重的部分是紅色炒瘸，大量圖層混合會(huì)消耗GPU的時(shí)間。
2.Color Copied Images :監(jiān)測圖片顏色格式寝衫，如果GPU不支持當(dāng)前圖片的顏色格式顷扩，會(huì)將其交給CPU預(yù)先進(jìn)行格式轉(zhuǎn)化，并且這張圖片被標(biāo)記為藍(lán)色慰毅。（Apple 的 GPU值解析32bit的顏色格式隘截，RGBA)
- Color Immediately ：設(shè)置調(diào)試顏色每幀更新。（一般不用）
- Color Compositing-Fast-Path Blue ：對(duì)任何直接使用OpenGL繪制的圖層高亮汹胃。
- Flash Updated Regions ：對(duì)重繪的內(nèi)容高亮成黃色婶芭。（使用Core Graphics繪制的圖層）
- Color Hits Green and Misses Red ：光柵化監(jiān)測，前面已述着饥。
- Color Offscreen-Renderded Yellow ：離屏渲染監(jiān)測犀农，前面已述。
- Color Non-Standard Surface Formats：Apple 文檔沒注解（一般不用）
性能優(yōu)化
請(qǐng)參考上一篇文章：Texture的異步渲染和布局引擎
