通过OpenGL理解前端渲染原理（1）

通过OpenGL理解前端渲染原理，本文着重介绍渲染管线工作流程。

一、OpenGL

OpenGL，是一套绘制3D图形的API，当然它也可以用来绘制2D的物体。OpenGL有一大套可以用来操作模型和图片的函数，通常编写OpenGL库的人是显卡的制造者。我们买的显卡都支持特定版本的OpenGL。

下图是用OpenGL做的旋转的立方体。

二、渲染原理

2.1 渲染管道

在OpenGL中，所有东西都在一个3D的空间里，而我们的屏幕和窗口都是2D的，所以OpenGL需要将3D的坐标转换成2D的坐标，做这件事的是OpenGL中的渲染管道（graphics pipeline）。

渲染管道可以分成两大部分：第一部分将3D坐标转换成2D坐标；第二部分把2D的坐标转换成实际的像素。

2.2 着色器

通常来说，渲染管道把一组3D坐标转换成屏幕上带有颜色的2D像素需要经过很多步。上一步的输出作为下一步的输入，所有步骤都是高度专一的，每步都有一个特定的函数，且可以很容易地并发执行。显卡有数千个处理核心来快速处理渲染管道中的数据，而这些是在每个步骤中通过运行在GPU上的多个小程序来处理的，这些小的程序被称之为程序着色器（shader）。

其中的一些着色器是可以配置的，开发者可以根据需求配置自己的着色器去替代已经存在的那些，这就让我们能够更自由和细粒度地控制渲染