shader 开发实战

1.网址 ** The Book of Shaders Editor ** 可以实时预览shader 渲染内容

2.网址 WebGLFundamentals WebGL State Diagram 可以查看着色器每一步做了什么工作

第一章 网格是什么

网格包含三个信息：顶点，边，面

其中顶点是三维空间的点，边是连接顶点的线段，而面试由3条或更多条边组成的二维形状。

在代码定义中，只有顶点存储在内存中，边和面试由顶点的顺序隐式定义的。在索引缓冲区中的数据结构定义。顶点的顺序大部分是多边形的中心以逆时针顺序定义，这个面称为正面，反之，称为反面。

渲染管线

渲染流程：顶点数据->顶点着色器->形状装配->光栅化->片段着色器->片段处理

顶点数据就是将3D模型文件中的网格数据读取到内存中

顶点着色器就是确定网格数据中的顶点在屏幕上的显示位置

形状装配就是按照网格数据绘制边组成多边形

光栅化就是计算网格可能占据的屏幕上的像素，为这些潜在像素中的每个像素创建一个片元，可以认为一个片元相当于一个像素，但不是所有的片元最终都会变成屏幕上的像素，因为重复的片元只显示最前面的，后面被挡住的像素，会在片段处理的时候给丢弃。

片段着色器就是给每个像素确定颜色

片段处理就是做最后的测试和混合操作，测试就是确定哪些片元显示，哪些片元丢弃。

着色器是什么？

主要关注顶点着色器和片段着色器，就是在GPU上执行的代码。

第二章 第一个着色器

编写GPU代码，怎么方便的调试和查看效果，很多开源软件都可以，这里推荐一个迷你框架，足够小，足以满足测试需求，是开源的叫openFrameworks，网址是：http://openframeworks.cc/download

书籍：Shader 开发实战

在线书籍翻译：The Book of Shaders: Hello world!