炫意html5
最早CSS3和HTML5移动技术网站之一

WebGL和HTML5在未来需要面对的挑战

在《Game Engine Gems 2》的第13章中,作者Rémi Arnaud基于3D渲染技术评测了不同的浏览器。Rémi认为,因为不能吸引游戏开发者,许多Web 3D渲染技术实际已经失败了。例如VRML,约翰·卡马克已经宣布了它的死亡。那WebGL如果想要吸引游戏开发者,会面临怎样的挑战呢?

浏览器:全屏

全屏是一种可以让内容覆盖整个屏幕的视图模式,没有窗口边框和其他多余的装饰。

重要性

PC上的游戏通常都是用全屏模式来显示。每款游戏总是尽力去提供一种增强用户沉浸感的体验,而移除地址栏、滚动条和操作系统菜单等等的可能会使玩家分心的元素。

WebGL和HTML5在未来需要面对的挑战

言论

“我认为全屏对于制作出吸引人的web game来说是一个决定性因素。”Mikael Emtinger (ROME, 技术总监)

“WebKit今天开始支持全屏了。Chrome也会尽快增加这一特性。我想Firefox应该也正在开发这一功能吧。”Gregg Tavares(Google I/O大会WebGL主题演讲者)

“为了制作一款好的游戏,我们并不需要最新的GPU技术,但是我们无法离开全屏和鼠标捕获。”Cedric Pinson(WebGL框架osg.js开发者)

现状

浏览器通常会支持一系列的全屏模式,但这其实并不算是真正的全屏。它通常不能覆盖整个屏幕,或者会留下地址栏和其他一些窗口的装饰。对于HTML5应用来说,也不可能请求切换到全屏模式。

如何解决

浏览器应当提供一个API来允许Javascript请求切换到全屏模式,然后让用户选择是否允许。就像让用户选择是否允许网站的弹出窗口一样。

评论

许多操作系统和窗口管理器都将一些自带的装饰强加给用户界面。为了摆脱这些多余的视觉元素,应用必须切换到一个完全不同的模式来显示。

输入:鼠标捕获

鼠标捕获是一种凭借鼠标与用户产生互动的模式,但它与鼠标指针在屏幕上的位置并无直接关系。这是一种称为“鼠标视角”(Mouse Look)的技术,其中操作系统里的鼠标指针被隐藏起来,并且移动鼠标也不会把鼠标指针移出应用程序的显示范围。

重要性
重要性

想要把内容呈现在用户眼前,游戏制作者有很多选择。最流行的一种就是第一人称视角(FPS),其中鼠标用来控制视角方向。这类游戏通常都使用了鼠标捕获,因为:

视角方向与鼠标指针在屏幕上的坐标位置无关,鼠标指针碰到了屏幕边缘或者是否在游戏区域内对游戏控制来讲没有任何意义。如果显示鼠标指针,会使用户分心。言论

“各家浏览器都在试图寻找一种最好的解决方案,既可以引入鼠标捕获技术,又可以防止一些网站”偷走”你的鼠标。浏览器对全屏技术的支持有助于解决这一问题。” Gregg Tavares(Google I/O大会WebGL主题演讲者)

现状

目前,浏览器尚不支持Javascript捕捉鼠标输入。原因非常简单,他们不想让用户失去对鼠标的控制。如果使用了鼠标视角,当鼠标指针离开了内容区域或者碰到了屏幕边缘会导致一系列问题。

如何解决Javascript必须向浏览器指明使用鼠标捕获的目的。浏览器必须询问用户是否允许程序使用鼠标捕获应当默认使用Esc键来退出鼠标捕获模式评论

鼠标提供了一种可以映射到屏幕上每一像素的高质量的输入方式。目前一种简单、甚至可以说是幼稚的解决方法就是永远将鼠标指针位置固定在屏幕中央。而FPS游戏通常吸引并推动用户来提高鼠标的灵敏度。对于鼠标视角来说,固定鼠标指针位置只会导致愚蠢和粗糙的用户体验。

WebGL:多重渲染目标(Multiple Render Targets)

多重渲染目标(Multiple Render Targets)是一种一次性将渲染输出储存在多个纹理中的技术。在OpenGL中可以查询gl_MaxDrawBuffers的值来实现此技术,而WebGL 1.0标准则支持在GLSL中使用gl_FragData来实现多重渲染目标。

从Direct3D 9.0和OpenGL 2.0开始,多重渲染目标被正式支持。

重要性
重要性

这是一种类似于延期着色(Deferred Shading)和屏幕空间环境光遮蔽(Screen-Space Ambient Occlusion)的技术,它们依赖于渲染通道中产生的数据,比如每个片元的颜色、法线和位置。

如果不能支持多重渲染目标,场景必须渲染多次(使用多个渲染通道)来获取这些数据,这将大大提高资源的开销。

言论

“如果当OpenGL ES 3.0推出的时候,如果能支持多重渲染目标,那么也许WebGL 2.0也会支持。” Gregg Tavares(Google I/O大会WebGL主题演讲者)

“在多通道中渲染有时会拖慢运行速度。”Mikael Emtinger (ROME, 技术总监)

现状

因为WebGL 1.0标准及其实现缺乏一种指定被绑定的纹理到目标索引的方法,多重渲染目标实际上是不可用的。(译者注:也就是说目前Frame Buffer Object只能绑定一个渲染目标(Render Target),虽然着色器支持多目标渲染,但是外部一次却只能设置一个渲染目标。另外一方面,理论上gl_FragData并不是专为MRT准备的,所以WebGL在不支持MRT的情况下支持这个关键字, 无可厚非。)

如何解决Khronos可以修正WebGL标准以实现多重渲染目标。Google可以更新他们的ANGLE项目以允许开发者用OpenGL 2.0或Direct3D 9.0实现多重渲染目标。WebGL:几何体实例化(Geometry Instancing)

几何体实例化(Geometry Instancing)这项技术允许在需要多次绘制具有相同性质的物体时,只调用一次绘制命令。作为OpenGL的扩展之一,实例化绘制(Draw Instanced)从2008年开始支持这一特性。

从Direct3D 9.0和OpenGL 2.0开始,实例化绘制被正式支持。

(视频:Blender 2.5 Planks Physics 作者:Phymec)

重要性

游戏场景中经常需要在每一帧中都绘制相同的物体许多次,比如植被、粒子、化身和物理刚体等。如果没有实例化绘制,渲染需要调用多次绘制命令或大量更新缓冲区(假实例化),这会导致性能大幅下降。

桌面和移动终端都会从这一特性中受益。实例化的替代方案是使用Javascript进行大量运算再将数据更新到GPU,或者单独调用多次绘制命令。

言论

“如果这项技术能在那些不支持它的硬件上被相对容易的模拟出来,那么就很有可能被添加到WebGL中。” Gregg Tavares(Google I/O大会WebGL主题演讲者)

现状

目前WebGL 1.0标准中不包含任何用于实例化绘制的API。

如何解决Khronos可以修订WebGL标准以实现实例化绘制。Google可以更新他们的ANGLE项目以允许开发者用OpenGL 2.0或Direct3D 9.0实现实例化绘制。WebGL:顶点纹理查找

可编程的硬件渲染需要两个步骤来生成一幅图像:顶点着色器和片元着色器。从传统上来讲,只有片元着色器可以从纹理中取样。

从Direct3D 9.0和OpenGL 2.0开始,顶点纹理查找被正式支持。

重要性
重要性

这项技术在位移贴图、物理草地波动和粒子效果中都能用到。

言论

“ANGLE项目正在着手添加对顶点着色器纹理查找的支持。” Gregg Tavares(Google I/O大会WebGL主题演讲者)

现状

Windows(r686)平台上的新版本的ANGLE运行库已经支持这一特性。

Firefox 6使用了这一版本的运行库。Google Chrome 12还没有使用这一版本的运行库。如何解决

Google可以更新Chrome并使用他们自己的新版本的ANGLE运行库。

WebGL:浮点纹理(Floating point textures)

传统上,在每个通道中纹理被限制在1个字节里。也就是说每个通道只能有256个不同状态。而浮点纹理在每个通道中使用了4个字节,这足够实现IEEE标准的浮点值。

从Direct3D 9.0和OpenGL 2.0开始,浮点纹理被正式支持。

重要性
重要性

在高动态范围渲染(HDR)、延期着色、屏幕空间环境光遮蔽和阴影映射等技术中,都需要用到浮点级别的精确度。如果没有浮点纹理,会导致开发者必须人工手动设置渲染,或者渲染效果根本无法实现。

言论

“我将向ANGLE项目提出(支持浮点纹理的)请求,看看他们怎么说。” Gregg Tavares(Google I/O大会WebGL主题演讲者)

现状

Windows(r686)平台上的新版本的ANGLE运行库已经支持这一特性。

Firefox 6使用了这一版本的运行库。Google Chrome 12还没有使用这一版本的运行库。如何解决

Google可以更新Chrome并使用他们自己的新版本的ANGLE运行库。

浏览器:在Windows平台上使用本地OpenGL还是ANGLE Direct3D

OpenGL这套API标准获得了大多数显卡制造商的良好支持(ATI、NVIDIA和Intel)。Direct3D是微软的标准,用于和OpenGL竞争。而ANGLE则是Google提出的用于将OpenGL转换到Direct3D 9.0的项目。

“ANGLE项目的目标是通过将OpenGL ES 2.0 API转换成DirectX 9 API,从而允许Windows用户无缝运行WebGL内容。”ANGLE Project

重要性有一个重要的现实是,目前众所周知,这个概念缺乏3D硬件驱动的支持,并且即使是支持的驱动也很不可靠。同样对于Direct3D也是这样,它经常过期、充满bug或者不可用。除了NVIDIA的硬件之外,其他硬件的OpenGL驱动都很烂。许多WebGL内容可以借助本地OpenGL运行的很好,但即使没有用到那些ANGLE(Direct3D)支持的不好的特性,却也不能借助Direct3D运行。能买来这么好的显卡玩游戏或者进行他3D任务的用户,通常都会配备很好的硬件和相应的驱动。对于同样是最新的OpenGL驱动和Direct3D来说,经常是OpenGL运行效果的更好。言论

“不,这个问题对于一般用户来说太复杂了。也许应该让开发者去选择,其中哪个能通过Javascript得到更酷的效果,这样选项就清晰明了了。” Mikael Emtinger (ROME, 技术总监)

“OpenGL可以制作出3A级游戏。OpenGL的支持从来都不是一个问题。”Mikkel Gjol (图形程序员,就职于Splash Damage,参与制作了3A级游戏《边缘战士》)

现状

默认情况下,Chrome和Firefox在Windows平台上使用了ANGLE/Direct3D。虽然用户可以更改这一设置,但是改起来非常困难和不便。

存在的问题

Firefox混合使用Direct2D和Direct3D,如果开启了本地OpenGL支持会降低页面渲染性能。

当下如何解决浏览器应当作出明确的抉择,OpenGL和Direct3D哪一个驱动更好,而不是默认使用Direct3D。WebGL程序可以指定使用其中一个对于程序来说更合适的驱动。用户可以全局或针对单个站点指定使用哪一个驱动,而不依赖于浏览器或WebGL程序的设置。最终如何解决PC制造商应当负责提醒用户及时升级最新的驱动程序。显卡制造商应当提高驱动程序的质量。

 

转自:mhtml

炫意HTML5 » WebGL和HTML5在未来需要面对的挑战

CSS3教程HTML5教程