核心動畫，每一幀都是由 blink 生成，都需要產生乙個新的 main frame；
blink 觸發然後交由合成器執行，比如說傳統的 css translation 或者新的 animation api，如果它們觸發的動畫經由 blink 判斷可以交由合成器執行；
使用 timer 或者 raf 由 js 驅動的動畫，比較典型的就是 canvas/webgl 遊戲，這種動畫實際上是由頁端自己定義的，瀏覽器本身並沒有對應的動畫的概念，也就是說瀏覽器本身是不知道這個動畫什麼時候開始，是否正在執行，什麼時候結束，這些完全是頁端自己的內部邏輯；
blink 觸發，合成器執行的動畫；
blink 觸發，無法由合成器執行的動畫；
由 timer/raf 驅動的 js 動畫；
幀率在 50 ～ 55 之間可以認為是良好的水平，使用者感覺到輕微卡頓，但整體來說還是比較流暢；
合成器找到這些圖層在當前可見區域的分塊；
合成器檢查這些分塊是否需要光柵化，如果需要，生成乙個對應的光柵化任務並分配所需要的 resource 放入任務佇列裡面；
renderer 程序會預先建立乙個或者多個 worker 執行緒（移動平台一般是兩個），這些執行緒會從任務佇列裡面順序取出每乙個光柵化任務並執行；
光柵化任務執行後，會通知合成器，合成器根據需要檢查哪些任務已經完成，已經完成的任務， resource 會轉交給對應的分塊；
瀏覽器渲染流水線解析（一）
layer compositor 圖層合成器 接收 blink 的輸入，負責圖層樹的管理，圖層的滾動，旋轉等矩陣變幻，圖層的分塊，光柵化，紋理上傳等任務 display compositor 接收 layer compositor 的輸入，負責輸出最終的 opengl 繪製指令，將網頁內容通過 gl...
渲染流水線
應用階段 cpu準備資料，skinmeshrender，meshfilter，meshrender 頂點資料，三角形資料，法線資料，切線資料，渲染設定指令，紋理資料，uv資料 由cpu傳送給gpu，即一次drawcall 幾何階段 頂點變換，計算頂點顏色 如逐頂點光照 齊次裁剪空間，透視除法，歸一化...
UnityShader 渲染流水線
渲染具體流程 幾何階段 光柵化階段 渲染流水線的最終目的在於生成或者說是渲染一張紋理，即我們在螢幕上看到的所有效果。它的輸入是乙個虛擬攝像機 一些光源 一些shader以及紋理等。渲染流程分為3個階段 應用階段 幾何階段 光柵化階段。圖中，綠色表示該階段是完全可程式設計控制的，黃色表示可以配置但不是...