未来都是未知的，虽然我们无法确定未来的科技会发展成什么样，人们的生活会发生什么样的变化，甚至我们以后使用的手...





未来都是未知的，虽然我们无法确定未来的科技会发展成什么样，人们的生活会发生什么样的变化，甚至我们以后使用的手机会变成什么样都是无法确定。

虽然我们无法预测长远的未来，但是，我们能够看清将会发生的一些变化，这其中就就有 HTML5。

HTML5

HTML5 的优势现在已经很明显，在这里先列几个重点：

• 超低的开发成本成为的企业首选
• 强大的跨平台特性只要有浏览器就能查看
• 实时更新页面抛弃版本升级问题
• 多媒体特性可以直接播放视频和音频，不需要再安装flash插件
• 自适应的设计可兼容pc和移动端
• 画布特性可以直接在浏览器绘制图形

HTML5 虽然向前的兼容性有一定的问题，不兼容ie，低版本浏览器兼容问题。

但是，我们必须顺应时代的发展，才能够屹立不倒，即使你现在不需要，不代表你在以后用不到。HTML5 强大的特性时刻在提醒我们，它就是 Web 的未来。

既然 HTML5 这么强大，那么我们能直接用浏览器进行 3D 渲染吗？答案是：可以。

WebGL 就是来解决浏览器和显卡之间的问题而诞生的，我可以通过直接用 JavaScript 进行图形渲染，再通过 HTML5 这个平台强大的特性真正实现了一次开发，多平台适用的愿望。

WebGL

WebGL (Web图形库) 是一种 JavaScript API，用于在任何兼容的Web浏览器中呈现交互式 3D 和 2D 图形，而无需使用插件。WebGL通过引入一个与 OpenGL ES 2.0 紧密相符合的 API，可以在 HTML5 的 元素中使用。

WebGL 虽然是基于 OpenGL 扩展而来的，但是它使用在了 HTML5 的浏览器中，这意味着 HTML5 的那些优势都能够被 WebGL 直接使用，多个平台，多种设备直接使用，一个网址打开即可查看效果统统现在可以依靠 HTML5 直接实现！

那我们用 WebGL 以后能够做什么？

• 数据可视化
• WebAR，ar
• 3D物理模型
• 游戏
• 3D动画

上面的每一样，都是足够我们用很长的时间来研究的方向。WebGL 现在的技术已经足以满足了我们所需要的技术需求，只要我们确定前方的路线，迈步向前即可。

我看好 WebGL 主要是因为 WebGL 作为 3D 图形渲染工具，它是最直接的，可以直接浏览器查看效果；

它是简单的，WebGL 有很多库比如 Three.js、Babylon 等甚至我们不需要专业知识都可以制作出3D效果；

它是成本偏低的，由于库的支持相对简单入手，很多企业都将WebGL作为招聘首选；

它是未来几年的发展的重点，搭上了 HTML5 发展的高速车，这几年很多企业会将 C/S 架构改为 B/S 架构，近些年的 WebGL 的资源需求会越来越多。

Three.js

Three.js 作为以 WebGL 封装的 3D 库，它的优势有哪些：

1. 直接使用前端熟悉的 JavaScript 进行开发WebGL 作为运行在浏览器中的一套协议，我们可以不需要进行C语言等相关的知识的学习，只需要使用我们熟悉的 JavaScript 语言就可以进行3D开发。
2. 对底层 WebGL 进行合理封装WebGL 直接用于开发还是有一定难度，尤其是对 OpenGL 图形没有研究的话，开发 WebGL 会难上加难。但是 Three.js 很好的解决了这个问题，降低开发难度，并且只需要更少的代码就可以实现我们所需要的效果。
3. 保留底层开发的特性虽然 Three.js 对 WebGL 底层进行了很好的封装，得益于 Three.js 的合理的封装，我们在 Three.js 开发当中也可以直接进行 shader、顶点数据处理等的原生开发。
4. 结构严谨灵活易于扩展Three.js 基于面向对象的思维设计，结构严谨并且灵活，大大降低各个模块之间的耦合性，不会产生相互依赖，增加功能或者修改代码都可以很简单的实现。

说到 Three.js，不得不提一下 WebGL 的现在的尴尬局面，WebGL是基于 OpenGL 的一个版本演变过来的，所以 OpenGL 的开发者有一定的学习优势。

但是还得必须学习一门 JavaScript 语言，再加上专门研究图形对互联网前端也需要一定的了解程度，无形之中增加的学习成本。

作为前端开发者虽然熟悉前端的内容，但是由于对图形学的研究欠缺，对从前端转行到 WebGL 开发增加了很多难度。

所以现在的市场上有一种奇怪的现象，WebGL 的开发人员匮乏，很多公司都愿意招收没有工作经验的 WebGL 开发人员。

Three.js 对原生的 WebGL 进行封装，采用了面向对象的思维，降低了前端开发入门 WebGL 的难度。只要我们熟悉一下 Three.js 的封装的思路，就能够很快的上手并且快速开发出产品。

课程介绍

《Three.js基础入门》作为入门课程，重点在于基础讲解，协助初学者了解 Three.js 的数据结构，基础的 API 以及相关的辅助插件使用和配置。来帮助初学者达到快速入门的目的。

课程特色

• 语言通俗易懂：全文使用了通俗易懂的语言将知识讲解清晰透彻，即使小白也能明白其中原理。
• 数据接口清晰：课程内将使用到的接口功能以及如何使用清晰的罗列，以达到复用。
• 案例结尾：每一节的内容都会制作当节内容的案例方便大家查看效果以及学习。
• 快速上手：从头带领大家从基础到进阶、实战，学完本课程可以轻松实现小案例。

本课程学完之后，大家可以对 Three.js 有一定认识，能够将 Three.js 应用到项目当中，通过面向对象的思维将 Three.js 的代码融合到现有的代码当中。

点击「阅读原文」免费参加 CSDN 大数据主题月，明晚直播~

    关注 CSDN大数据