WebAR ｜ 关于WebGL标准

Posted 2023-03-01

参考技术A AIRX三次方 •帮助年轻人获得适应未来社会的新技术能力

 专注 AR+VR+Unity+Unreal+CV+AI方向

WebGL是html5 canvas元素的扩展，现已广泛用于开发需要3D可视化的Web应用程序。它是一种3D图形API，基于OpenGL ES 2.0。为了简化开发，市面上有一些流行的基于WebGL的框架：

Three.js：Three.js是一个基于javascript的库，它以低复杂度在Web浏览器上创建3D内容，是轻量级的，可以在HTML5 canvas，SVG和WebGL的帮助下执行渲染。

Scene.js：Scene.js是基于WebGL的库，它使用JavaScript在Web浏览器上进行3D可视化。它与Three.js不同，因为它旨在快速呈现大量可单独拾取的对象。此功能使该库可用于工程和数据可视化应用程序。

谁开发了WebGL？一位名叫Vladimir Vukicevic的美裔塞尔维亚软件工程师完成了基础工作，并领导了WebGL的创建。在2007年，Vladimir开始为HTML文档的Canvas元素开发OpenGL原型。2011年3月，Kronos Group创建了WebGL。

主流浏览器（例如Google Chrome，Mozilla Firefox，Safari和Opera）都支持它，有些浏览器（例如Internet Explorer 11）并不完全支持WebGL。此外，WebGL是一种低级API，因为它被设计为直接与图形卡进行交互。因此，具有低图形卡内存的设备可能会带来严重的性能问题。

1、WebGL与OpenGL之间的主要区别

WebGL基于OpenGL ES，它缺少常规OpenGL具有的许多功能，例如仅支持顶点和片段着色器。OpenGL具有WebGL所不具备的功能，例如几何体着色器，曲面细分着色器和计算着色器。

WebGL主要用于浏览器。OpenGL确实需要本机驱动程序，并且主要用于安装软件。

WebGL用于Web应用程序，而OpenGL用于许多视频游戏。

WebGL更易于学习和开发应用程序。如果你熟悉WebGL，则可以轻松学习OpenGL。

在WebGL中，它可以使用2D纹理来伪造3D纹理。在OpenGL中，不需要这样做，因为它具有很多功能，例如几何体和着色器。

在WebGL中，从一开始就被迫学习使用着色器和缓冲区。在OpenGL中，并非如此。

WebGL具有较少的功能，因此学习曲线较少。OpenGL具有更大的学习曲线，因为它具有包括WebGL在内的许多功能。

WebGL基于OpenGL ES 2，而不是纯OpenGL。OpenGL ES是OpenGL的子集。OpenGL ES具有较少的功能，并且对用户来说非常简单。OpenGL具有很多功能并且难以使用。

2、桌面浏览器支持情况

Google Chrome浏览器 ：自2011年2月发布第9版以来，所有具有图形卡且驱动程序已更新的平台均已启用WebGL 1.0。在Windows上，默认情况下，Chrome使用ANGLE（几乎本机图形层引擎）渲染器来翻译OpenGL ES Direct X 9.0c或11.0，具有更好的驱动程序支持。在Linux和Mac OS X上，默认渲染器为OpenGL，但是也可以将OpenGL强制为Windows上的渲染器。自2013年9月以来，Chrome还拥有更新的Direct3D 11渲染器，但需要更新的图形卡。

Mozilla Firefox浏览器 ：从4.0版开始，所有具有图形卡且驱动程序已更新的平台均已启用WebGL 1.0。自2013年以来，Firefox还通过ANGLE在Windows平台上使用DirectX。

Safari：在OS X Mountain Lion，Mac OS X Lion和Mac OS X Snow Leopard上的Safari 5.1上安装的Safari 6.0和更高版本实现了对WebGL 1.0的支持，在Safari 8.0之前默认情况下已禁用。Safari 12版（在macOS Mojave中可用）具有对WebGL 2.0的支持，目前作为“实验”功能。

Opera ：WebGL 1.0已在Opera 11和Opera 12中实现，但在2014年默认情况下已禁用。Opera43+支持WebGL 2.0。

Internet Explorer — Internet Explorer部分支持WebGL 1.0。最初，它没有通过大多数正式的WebGL一致性测试，但后来Microsoft发布了一些更新。最新的0.94 WebGL引擎目前已通过Khronos测试的约97％。也可以使用第三方插件（例如IE WebGL）将WebGL支持手动添加到Internet Explorer的早期版本中。

Microsoft Edge：最初的稳定版本支持WebGL 0.95版（上下文名称：“ experimental-WebGL”），以及从GLSL到HLSL转译器的开源GLSL。版本10240+支持WebGL 1.0作为前缀。在将来的版本中，WebGL 2.0被计划为中等优先级。

3、手机浏览器支持情况

BlackBerry 10:从OS 10.00版开始，WebGL 1.0可用于BlackBerry设备。

BlackBerry PlayBook:WebGL 1.0可通过WebWorks和PlayBook OS 2.00中的浏览器获得

android浏览器 :基本上不受支持，但是在固件升级后，索尼爱立信Xperia系列的Android智能手机具有WebGL功能。三星智能手机还启用了WebGL（已在Galaxy SII（4.1.2）和Galaxy Note 8.0（4.2）上进行了验证）。Google Chrome支持此功能，该功能已取代了许多手机中的Android浏览器（但不是新的标准Android浏览器）。

Internet Explorer : Windows Phone 8.x（11+）上提供了WebGL 1.0

移动版Firefox:从Firefox 4开始，WebGL 1.0就可用于Android和MeeGo设备。

Google Chrome浏览器:WebGL 1.0自Google Chrome 25起可用于Android设备，自30版本起默认启用。

Maemo :在诺基亚N900中，从PR1.2固件更新开始，可在库存的microB浏览器中使用WebGL 1.0。

MeeGo:“ Web”不支持WebGL 1.0。但是，可以通过Firefox使用它。

Microsoft Edge:Windows 10 Mobile上提供了Prefixed WebGL 1.0。

Opera Mobile :Opera Mobile 12支持WebGL 1.0（仅适用于Android）。

Sailfish操作系统:默认的Sailfish浏览器支持WebGL 1.0。

Tizen:支持WebGL 1.0。

ios:WebGL 1.0在iOS 8中可用于移动Safari。

参考链接：

https://arvrjourney.com/webgl-the-new-standard-for-3d-graphics-on-the-web-2d8e206e7ef0