Threejs＋Blender 制作光标闪烁和咖啡冒气的动画效

　　这周跟着大佬学习用Threejs制作了两个动画效果，学会了如何调试Threejs的效果。

　　注：之后的所有模型都通过Blender导出的时候进行了压缩，如果模型太大导致软件崩溃，可以用命令行压缩模型：

　　在模板的Utils/Loader.js中已经对压缩的模型进行了Draco解压处理，这样所有模型加起来由原来的3.4M转为300KB，非常理想的大小。

　　在Blender中新建一个分段数多的平面放到咖啡杯中，导出为coffeesteam.glb

　　Uniforms: 所有顶点都具有相同的值的变量。如灯光、雾、阴影贴图就是被储存在uniforms的数据。uniforms可以通过顶点着色器和片元着色器来访问。

　　Attributes: 储存顶点位置、法线、顶点颜色等数据，只可以在顶点着色器中访问。

　　顶点着色器首先运行; 它接收attributes， 计算/操纵每个单独顶点的位置，并将其他数据（varyings）传递给片元着色器。片元（或像素）着色器后运行; 它设置渲染到屏幕的每个单独的“片元”（像素）的颜色。

　　选择着色器：shadertoy是一个着色器分享交流的网站，网站有很多附带源码的着色器，我们可以选择自己喜欢的着色器，实现酷炫的动画背景。

　　position是每个顶点的坐标值，当着色器代码执行时，会循环执行gl_Position和gl_FragColor设置顶点位置，和颜色插值。

　　vec,mat这些类型其实是由float复合而成的,当它们与float运算时,其实就是在每一个分量上分别与float进行运算,这就是所谓的运算。