是否有任何理由使用WebGL而不是2D游戏/应用程序的2Dcanvas？
使用WebGL代替2D游戏/应用程序的2D-Canvas是否有其他的原因，除了性能？
换句话说，WebGL提供哪些2Dfunction是2D-Canvas无法轻松实现的？
从另一面看这个问题：
开发人员如何select一种技术而不是另一种？
- 在他们已经build成的系统中整合得更好
- 更容易使用
- 是比较快的
- 有更多的能力或更好的适合他们的需求
- 成本
- 更多的平台 – 独立
所以我将讨论关于这些特性的canvas和webGL API之间的区别。
canvas和webGL都是JavaScript API。 所以他们在集成（绑定）方面差不多。 他们都有一些库/引擎，可以加快你的编码。 不同的库为您提供了不同的方式来组织您的代码，所以它不同于如何围绕绘图API构build代码，但它仍然是几乎相同的东西（其余代码如何与它绑定在一起）。
如果使用库，编写代码的难易程度取决于库本身。
但是如果你从零开始编写代码，那么canvas'API的学习和理解要容易得多，它只需要很less的math知识。 发展是快速和直接的。 WebGL需要一名具有强大math技能的开发人员，他们完全理解渲染pipe道，知道他在做什么。 这些人很难find，生产速度较慢（因为代码的大小和复杂性，将其整合到其余部分），因此成本更高。
WebGL速度更快，function也更多。 毫无疑问， 这是一个本地的3d API，让您可以完全访问渲染pipe道，所有的代码和效果执行得更快，更可调。 使用webGL真的没有限制。
canvas和webGL都是html5的好东西。 通常支持一个的设备将支持另一个。
所以，总结一下：
- 合并绘图API代码和其余（集成）：类似
- 使用方便：
- （带库）canvas = webGL
- （从头开始）webGL <<canvas
- 速度：webGL>canvas
- function：webGL>canvas
- 成本：webGL要贵得多
- 平台：非常相似
希望这可以帮助。
PS公开讨论。
最大的优势是pipe线的可编程性和性能。 例如，假设你正在绘制两个盒子，一个是隐藏的，一些GL实现可以放弃隐藏的盒子。
至于比较，由于在这里没有创build表的快捷方式，我只是上传了一张比较表的图片。 仅为完整性添加Three.js。
WebGL提供的2Dcanvas不具备哪些2Dfunction？ 最大的一个恕我直言是graphics硬件上的可编程片段着色器。 例如，在WebGL中，可以在3D硬件上使用着色器来实现Conway的生命游戏：
http://glslsandbox.com/e#207.3
这种2D显示只能在CPU上运行，而不能在2D上运行。 所有的计算都将在JavaScript中实现，即使在networking工作者的帮助下也不会像GPU那样平行。 这当然只是一个例子，各种有趣的2D效果都可以用着色器来实现。
从我自己的应用程序的经验来看，graphics着色器一直是唯一需要支持WebGL的原因。 易用性对我来说没有什么意义，因为这两个框架都可以用three.js抽象出来。 假设我不需要着色器，我允许使用任一框架来最大化浏览器/机器支持。
那么，性能将是最大的原因之一，因为当你编写一个游戏时，它必须是快速的。 但是还有其他一些原因可能会导致您在canvas上selectWebGL。 它提供了编码着色器，照明和缩放的可能性，如果您正在制作商业游戏应用程序，这非常重要。 在50个精灵之后，canvas也变得迟钝。
正如你特别想要的一些经典的2D与canvas不能很好地工作：
- 颜色转换（如闪烁的精灵）
- 重复位图填充
- 在旋转下平铺地图（在canvas下，一些实现将创build接缝）
- 深层次（非常依赖于实现）
- 乘法或加法混合
…但当然你有像素访问，所以你可以做任何事情，包括上面，手动。 但是这真的很慢。 你可以编写Mesa openGl来渲染到理论上的canvas。
使用webGL的另一个重要原因是结果很容易移植到其他地方。 这也使得这个技能更有价值。
使用canvas的原因是，它仍然是更好的支持，如果你学习像素逐像素，这也是一个非常宝贵的教训。
使用Canvas无法做到这一点：canvas允许使用get / putImageData来压缩字节，并且可以使用webGL以编程方式绘制线条，圆形等等。
但是，如果你正在寻求做一些图纸，而且在60fps的时候还有一些效果，那么性能差距太大了，以至于在canvas上运行的时候，就不可能用canvas。 性能是一个根本function。
然而，webGL编程相当复杂：看看canvas是否足够适合你，或者寻找一个缓解疼痛的库…
其他缺点：它不适用于IE浏览器（但什么？）和一些手机。
在这里查看兼容性： http ： //caniuse.com/webgl
由于WebGL是特别新的技术，并且HTML5canvas更加成熟
使用取决于你的用户。 如果你认为你的用户将使用移动设备，那么我会build议
HTML5canvas，但如果你想更好的2D渲染，我会使用WebGL。 所以你可以做的是如果
如果它们在支持WebGL的平台上，则使用HTML5的移动渲染。
例如：
if (window.WebGLRenderingContext) { webGLcanvasApp() } else if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ) { html5CanvasAppFMobile() } else { html5CanvasApp() } 资料来源：
正确的方法来检测WebGL的支持？
在jQuery中检测移动设备的最佳方法是什么？
