WebGL 初识记录

由于AI这几年如火如荼，一直在想AI浪潮下更新更好的用户交互应该是什么样的？虽然不知道理想是什么样的交互，但是显然不是目前主流的文字输入，滑动等方式；应该越来越趋近于人与人交互的形式，比如语音、视频、甚至脑洞大一点以后直接通过脑电波和电脑交互也是有可能的，因此感觉前端3D技术在AI背景下的应用机会更多一些。

于是浅学&尝试了一下原生 webgl 开发，主要学习了MDN上关于WebGL的基础教程，主要包括基础概念（光源、相机、模型、纹理）、2D图像绘制、3D图像绘制、顶点位置定义、场景定义、简单的动画实现等等。

使用 WebGL 原生 API 实现了2D、3D 基础模型的绘制（三角形、正方形、正方体），模型的旋转跳跃闭着眼，实现了从建模软件导出模型文件并且通过代码引入&展示的功能。看一下效果展示，顺便嘚瑟一下，粉色莲花形状的模型是前段时间研究3D建模时，用Shapr3D自己绘制的。

二维图像绘制：

3D立方体绘制：

导入模型文件并展示：

感受是：

1. WebGL 开发虽然也是写 js，但是和日常写二维页面的 api 基本没重叠，只有一些 js 基础语法一样。
2. WebGL 开发里的“模板”代码非常非常多 - 就是和实际业务没啥关系，但是必须得声明或者写的代码，写起来相当繁琐。
3. AI 辅助 WebGL 的代码编写能力非常强大，我本次代码实现 98% 以上都用的 cursor 帮助生成 & debug的。
4. 使用原生 WebGL 的 API 编写实际业务恐怕非常困难，原因参考感受2。因此如果想实际做 3D 开发的话，还是要引入工具，如 three.js、babylon.js等等。

下次有时间再研究一下Web端实现3D效果的工具和底层原理，比如 Three.js 和 Babylon.js 这种。