WebGL著色器程式
我們通常使用三角形來構建網格。因為WebGL使用GPU加速計算，有關這些三角形中的資訊一般從CPU傳送到GPU，這需要大量的通訊開銷。
WebGL提供了一個解決方案以降低通訊開銷。由於它使用ES SL(嵌入式系統著色語言)在GPU上執行，我們編寫所有程式需要使用著色器程式的用戶端系統上的圖形元素(這是我們使用OpenGL ES著色語言/GLSL來寫程式)。
這些著色器是GPU和用於編寫著色器程式的程式語言是GLSL。在這些著色器，我們定義確切的頂點，轉換，材質，光源，和攝像機使用彼此互動以建立具體影象。
總之，這是一個實現的演算法來獲得畫素一個網狀片段。在後面的章節我們將討論更多關於著色器。有兩種型別的著色器- 頂點著色器和片段著色器。
頂點著色器
頂點著色器是所謂的在每個頂點的程式程式碼。它被用於轉化(移動)的幾何形狀(例如：三角形)從一個地方到另一個地方。它處理每個頂點的資料(每個頂點的資料)，例如頂點坐標，法線，色彩，和紋理坐標。
在頂點著色器的ES GL程式碼，程式員必須定義的屬性來處理資料。這些屬性指向一個頂點緩衝區物件是用JavaScript編寫的。
下面的任務可以使用頂點著色器來進行 -
-
頂點變換
-
正常轉化和正常化
-
紋理坐標生成
-
紋理坐標變換
- 燈光/光線
-
顏色材料應用
片段著色器(畫素著色器)
網狀由多個三角形形成，並且每一個三角形的表面被稱為一個片段。片段著色器是對每一個片段的所有畫素上執行的程式碼。這是寫計算以填補單個畫素的顏色。
下面的任務可以使用片段著色器來進行 -
-
插值操作
-
紋理存取
-
紋理應用
-
灰濛/霧
-
顏色總和
OpenGL ES SL 變數
OpenGL ES的SL完整形式是 OpenGL 的嵌入式系統著色語言。為了處理著色器程式中的資料，ES SL提供了三種型別的變數。它們如下 -
-
屬性− 這些變數儲存頂點著色器程式的輸入值。屬性指向包含每個頂點資料的頂點緩衝物件。頂點著色器被呼叫的時候，這個屬性指向不同的頂點的VBO。
-
制服− 這些變數儲存輸入資料，很常見為頂點和片段著色器，例如光位置，紋理坐標和顏色。
-
變動充填− 這些變數用來從頂點著色到片段著色器傳遞資料。有了這麼多的基礎知識，現在我們將繼續前進，討論圖形管線。