在 OpenGL ES 中你必须创建两种着色器：顶点着色器 (vertex shaders) 和片段着色器 (fragment shaders)。
相关概念
VertexShader 顶点着色器

FragmentShader 片段着色器

顶点着色器定义了在 2D 或者 3D 场景中几何图形是如何处理的。一个顶点指的是 2D 或者 3D 空间中的一个点。在图像处理中，有 4 个顶点：每一个顶点代表图像的一个角。顶点着色器设置顶点的位置，并且把位置和纹理坐标这样的参数发送到片段着色器。

然后 GPU 使用片段着色器在对象或者图片的每一个像素上进行计算，最终计算出每个像素的最终颜色。图片，归根结底，实际上仅仅是数据的集合。图片的文档包含每一个像素的各个颜色分量和像素透明度的值。因为对每一个像素，算式是相同的，GPU 可以流水线作业这个过程，从而更加有效的进行处理。使用正确优化过的着色器，在 GPU 上进行处理，将使你获得百倍于在 CPU 上用同样的过程进行图像处理的效率。

把东西渲染到屏幕上从一开始就是一个困扰 OpenGL 开发者的问题。仅仅让屏幕呈现出非黑色就要写很多样板代码和设置。开发者必须跳过很多坑 ，而这些坑所带来的沮丧感以及着色器测试方法的匮乏，让很多人放弃了哪怕是尝试着写着色器。

Uniforms 是一种外界和你的着色器交流的方式。Uniforms 是为在一个渲染循环里不变的输入值设计的。如果你正在应用茶色滤镜，并且你已经指定了滤镜的强度，那么这些就是在渲染过程中不需要改变的事情，你可以把它作为 Uniform 输入。 Uniform 在顶点着色器和片段着色器里都可以被访问到。

Attributes 仅仅可以在顶点着色器中被访问。Attribute 是在随着每一个顶点不同而会发生变动的输入值，例如顶点的位置和纹理坐标等。顶点着色器利用这些变量来计算位置，以它们为基础计算一些值，然后把这些值以 varyings 的方式传到片段着色器。

最后，但同样重要的，是 varyings 标签。Varying 在顶点着色器和片段着色器都会出现。Varying 是用来在顶点着色器和片段着色器传递信息的，并且在顶点着色器和片段着色器中必须有匹配的名字。数值在顶点着色器被写入到 varying ，然后在片段着色器被读出。被写入 varying 中的值，在片段着色器中会被以插值的形式插入到两个顶点直接的各个像素中去。

可编程管线

776445-20151223012428077-1088396053.png

1.VBO/VAO（顶点缓冲区对象或顶点数组对象）:

VBO/VAO是cpu提供给GPU的顶点信息，包括了顶点的位置、颜色（只是顶点的颜色，和纹理的颜色无关）、纹理坐标（用于纹理贴图）等顶点信息。

2.VertexShader（顶点着色器）：

顶点着色器是处理VBO/VAO提供的顶点信息的程序。VBO/VAO提供的每个顶点都执行一遍顶点着色器。Uniforms（一种变量类型）在每个顶点保持一致，Attribute每个顶点都不同（可以理解为输入顶点属性）。执行一次VertexShader输出一个Varying和gl_positon。

776445-20151223012919374-1516274005.png

3.PrimitiveAssembly（图元装配）：

顶点着色器下一个阶段是图元装配，图元（prmitive）是三角形、直线或者点精灵等几何对象。这个阶段，把顶点着色器输出的顶点组合成图元。

4.rasterization（光栅化）：

光栅化是将图元转化为一组二维片段的过程，然后，这些片段由片段着色器处理（片段着色器的输入）。这些二维片段代表着可在屏幕上绘制的像素。用于从分配给每个图元顶点的顶点着色器输出生成每个片段值的机制称作插值（Interpolation）。这句不是人话的话解释了一个问题，就是从cpu提供的分散的顶点信息是如何变成屏幕上密集的像素的，图元装配后顶点可以理解成变为图形，光栅化时可以根据图形的形状，插值出那个图形区域的像素（纹理坐标v_texCoord、颜色等信息）。注意，此时的像素并不是屏幕上的像素，是不带有颜色的。接下来的片段着色器完成上色的工作。

5.FragmentShader（片段着色器）：

片段着色器为片段（像素）上的操作实现了通用的可编程方法，光栅化输出的每个片段都执行一遍片段着色器，对光栅化阶段生成每个片段执行这个着色器，生成一个或多个（多重渲染）颜色值作为输出。

776445-20151223012919374-1516274005.png

6.Per-Fragment Operations（逐片段操作）

在此阶段，每个片段上执行如下功能:

776445-20151223013739749-765976931.png

1）pixelOwnershipTest（像素归属测试）：

这个用来确定帧缓冲区中位置（x，y）的像素是不是归当前上下文所有。例如，如果一个显示帧缓冲区窗口被另一个窗口所遮蔽，则窗口系统可以确定被遮蔽的像素不属于此opengl的上下文，从而不显示这些像素。

（2）ScissorTest（剪裁测试）：

如果该片段位于剪裁区域外，则被抛弃

（3）StencilTest and DepthTest（模板和深度测试）：

深度测试比较好理解，若片段着色器返回的深度小于缓冲区中的深度，则舍弃。模板测试没有用过，不清楚具体功能，猜测功能应该和名字一样，模板形状内可通过。

（4）Blending（混合）：

将新生成的片段颜色值与保存在帧缓冲区的颜色值组合起来，产生新的RGBA。

（5）dithering（抖动）：

最后把产生的片段放到帧缓冲区（前缓冲区或后缓冲区或FBO）中，若不是FBO，则屏幕绘制缓冲区中的片段，产生屏幕上的像素。