`
wjlgryx
  • 浏览: 308510 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

WebGL必须要面对和克服的困难:

阅读更多

WebGL必须要面对和克服的困难:


  • 因为OpenGL ES 2.0并没有被大多数的硬件平台所支持,所以将会导致很多设备无法运行WebGL。
  • 因为OpenGL ES 2.0对JavaScript的依赖程度达到了100%,其利用JavaScript来处理应用程序的场景绘图,例如:1)计算场景中子父物体间的矩阵运算。2)Culling Calculating(计算不需要绘制的内容)。3)分类计算,用于处理透明对象等。4)计算场景所包含的所有动画数据。这些应用会因为JavaScript的计算瓶颈而受到不同程度的限制。
  • 无法高效的利用Javascript处理Skinning,如果利用GPU的运算能力来处理,势必会占用过多GPU的资源,从而无法更好的协调其它效果,例如:Shadow mapping(绘制软边的阴影贴图算法)
  • 借用一个例子来更进一步的剖析,例如:处理一个带有phong材质的物体,每一帧的渲染就接近多达10次以上的GL调用:
    • 一、给Shader传递所包含的Matrix信息(通常1-5个Matrices)。
    • 二、每个需要传递的Color参数信息都将占用一次GL调用,对于Phone材质而言,至少需要两次调用(Color &Shininess)。然而如果追求效果的最大化,那么可以把五个参数都用上(Emissive, Ambient,Diffuse,Specular, Shininess)一共产生五次GL调用。
    • 三、处理定点坐标。
    • 四、处理法线信息。
    • 五、如果模型包含有贴图信息,那么还需要增加一次GL调用来传递UV信息。
    • 六、最后再次执行GL调用完成对模型的绘制。
    • 从上面的结果来看,最少也需要5次GL调用,最多可以达到14次。如果结合最终项目的需求以每秒30帧的频率来计算,其效率可想而知。
  • WebGL并没有积极的去解决数据导入问题。目前为止,仅仅可以利用IMG tags来嵌入材质信息,暂不支持DXT图片压缩格式(而DXT已经被大多数的3D显卡硬件所支持)。暂无预处理技术,依然是在裸奔。在一个独立的File中不支持CubeMaps(是一个以较低性能损耗来描绘静态物体对周围环境的反射效果的捷径)。除了利用JavaScript的数组以外,没有更好的方式传递几何信息。
以上的信息可以对当前WebGL的情况有个基本的了解,其实无论比较的结果如何,未来遇到实际问题时,都是要根据实际情况来选择适用的解决方案。在这里没有谁有压倒性的优势,都各有利弊。对于开发者来讲,追求效率的同时,可以在要求不够严格的情况下选择最易上手的工具,缩短开发周期。

分享到:
评论

相关推荐

    Unity通用WebGL模板Universal WebGL Template 1.2.1

    7. **安全与性能**:由于WebGL是基于浏览器的,因此要考虑安全性问题,如防止跨站脚本攻击(XSS)和数据泄露。此外,WebGL应用可能需要优化以应对可能的内存和性能限制。 总之,Unity通用WebGL模板1.2.1为开发者...

    unity webgl中文输入法package包

    webgl打包后支持中文输入,unity2021已经测试,将webglinput.cs 脚本添加到inputfield组件上即可

    WebGL编程指南函数库

    WebGL是一种基于OpenGL标准的JavaScript API,用于在任何兼容的Web浏览器中实现硬件加速的2D和3D图形渲染。这个“WebGL编程指南函数库”包含了一系列辅助脚本,帮助开发者更方便地进行WebGL编程。以下是这些脚本的...

    WebGL 开发介绍.zip

    WebGL是一种基于OpenGL标准的JavaScript API,用于在任何兼容的Web浏览器中进行2D和3D图形渲染。它使得开发者可以在无需插件的情况下,在网页上实现高性能的图形处理,为互联网用户提供了丰富的交互式视觉体验。 一...

    WebGL编程指南PDF和源码

    WebGL(Web Graphics Library)是一种JavaScript API,用于在任何兼容的Web浏览器中渲染交互式的2D和3D图形,无需插件。它基于OpenGL ES 2.0标准,并且是HTML5的一个组成部分,使得开发者可以在网页上直接进行图形...

    webgl-react-boilerplate:WebGL React应用:high_voltage:

    该项目的目标是在Jam3上标准化基于WebGL和React的项目。 基于经验,它具有用于渲染和场景管理的高度优化的方法。 对于想直接进入webgl编码的创意编码人员来说,这是一个很好的起点。 特征 流 该项目使用类型。 一...

    unity-webgl-copy-and-paste:支持Unity WebGL中的复制和粘贴

    Unity WebGL复制和粘贴由于某种原因,Unity决定不支持WebGL中的复制和粘贴。 这是尝试将其重新添加。不保证它是完美的 :grinning_face_with_sweat: 目前,仅支持和 示例: : 指示下载并将其添加到您的项目中。 如果...

    webgl-lib.rar

    WebGL Debug可以帮助开发者检测和修复渲染错误,比如检查着色器编译错误、缓冲区状态或者性能问题,使得调试过程更加直观和高效。 4. **webgl-utils.js**: WebGL Utils可能是一个综合性的实用工具集,包含了创建...

    webgl文档以及工具

    6. **WebGL工具**:可能包含的工具有Shader Toy(在线GLSL编辑器)、Three.js(一个流行的WebGL库)、Glitch(代码编辑和分享平台)等,这些工具可以帮助开发者更方便地编写和调试WebGL代码。 7. **WebGL应用实例**...

    webgl 工具库 lib.rar

    WebGL是一种JavaScript API,用于在任何兼容的网页浏览器中渲染交互式2D和3D图形,无需插件。它基于OpenGL ES 2.0规范,是Web开发中的一个强大工具,使得网页可以呈现复杂的视觉效果。这个“webgl 工具库 lib.rar”...

    WebGL 可视化3D绘图框架:Three.js 零基础上手实战.rar

    WebGL是一种基于OpenGL标准的JavaScript API,用于在任何兼容的Web浏览器中进行2D和3D图形渲染,无需插件支持。它使开发者能够在网页上创建动态、交互式的3D内容,极大地拓宽了Web开发的可能性。Three.js是建立在...

    WEBGL_webgl_

    WebGL是一种基于OpenGL标准的JavaScript API,用于在任何兼容的Web浏览器中实现交互式的2D和3D图形渲染。这个“WEBGL_webgl_”很可能是一份教程或教材,旨在帮助初学者掌握WebGL技术,并随着学习者的进步不断更新...

    WebGL Overview

    - 定义着色器:编写顶点着色器和片段着色器,它们是WebGL渲染管线中用于处理图形顶点和像素的核心部分。 - 初始化像素缓存:配置像素存储参数以优化像素操作。 - 初始化着色器:将编写的着色器程序附加到渲染上下...

    webGL公用函数库设置的0积分

    WebGL是一种基于OpenGL标准的JavaScript API,用于在任何兼容的Web浏览器中进行2D和3D图形渲染,无需插件。这个API允许开发者在网页上创建交互式、高性能的图形内容,极大地丰富了Web应用程序的视觉表现力。在这个...

    webgl编程指南公用函数库

    WebGL是一种基于OpenGL标准的JavaScript API,用于在任何兼容的Web浏览器中实现交互式2D和3D图形渲染。这个“webgl编程指南公用函数库”集合了几个关键的JavaScript文件,它们是WebGL开发中常用的辅助工具,帮助...

    WebGL可视化3D绘图框架:Three.js 零基础上手实战课程

    分享课程——WebGL可视化3D绘图框架:Three.js 零基础上手实战,附软件+PPT+代码+文档资料下载。 本课程主要的功效就是让你学习完本教程后,能够写出在浏览器上流畅运行的3D程序,包括但不限于:大数据可视化,360...

Global site tag (gtag.js) - Google Analytics