前端如何开发3D网页?(前端如何开发3d网页版)

前端如何开发3D网页?(前端如何开发3d网页版)

前言

不论是电脑桌面应用,还是 Web 应用,想要渲染 3D 模型,都需要显卡的支持。显卡越好,渲染的速度就会越快。质量就会越高。

而桌面应用因为直接跟电脑显卡通信对接,使用操作系统提供的图形语言 GL,再加上代码优化,可以写出高质量,高性能的 3D 应用。但它也有它的缺点,比如开发难度高,需要高水平的 C 开发人员;应用不易扩展,针对不同平台需要不同平台的软件安装包。

而 Web 端渲染 3D 模型是由于浏览器厂商封装了浏览器与显卡的通信规范,暴露出 JavaScript API,供前端开发人员调用,而这个规范就叫 WebGL。通过 WebGL 开发的 Web 程序由于接口的封装性,性能肯定不足桌面端应用的水平,但也有可取之处:比如开发相较而言简单,开发人员上手难度低,很容易培养大量的人员;应用扩展性高,手机、平板、支持现代浏览器的电脑都可以直接通过网址打开。

小结

技术的选择取决于业务需求,业务要求性能第一,首先原生开发;业务要求快速敏捷,肯定选难度最低,出效果最快的。

正如现在移动端开发一样,Android 和 iOS 原生开发效率低,难度大,针对不同平台需要专门的开发人员,所以现在除了重要的应用如微信、支付宝,追逐性能的手机游戏外,都会优先考虑跨平台框架,也就是 H5 技术去开发 App。

Three.js

使用 JavaScript 写纯 WebGL 的代码去操作显卡处理3维数据是很辛苦的,所以一般开发而言都会使用 WebGL 的封装库去开发,封装库的意义就在于开发效率高,上手成本低,性能也能满足大部分业务的需求。Three.js 是一款比较成熟的 JavaScript 3D库,适用于各种3D 场景,采用 MIT 许可证开源,GitHub Star 也有 7万多。Three.js 和 WebGL 的关系就很像 JQuery 和 JavaScript。

AutoDesk Forge

Forge 是 Autodesk 公司推出的一款开发 Web 端 3D 应用的云平台,它拥有模型格式云端转换,使用 Revit 开发的 模型可以很方便地通过它转换,再使用 Forge 提供的 JavaScript 封装库,可以很轻松地在网页上渲染,而且提供了很多常用的工具。

它底层封装了 Three.js 的 API。所以它属于业务层的封装库。

缺点是:它的服务器在美国,上传的模型文件都是上传到美国的服务器,虽说官网强调不会侵犯用户的数据隐私,但谁能保证呢。数据服务访问速度不快,渲染速度还行。

BIMFACE

BIMFACE 是一款国产的云平台,拥有跟 Forge 一样的能力,而且针对国内常见的需求,提供了快捷服务,可以很方便地集成进自己的项目。缺点也有:二次封装的库都会存在一定的性能问题,因为加了一层封装就意味着加了一层代码,而 JavaScript 引擎就会多执行一层代码,会影响执行效率;扩展性差,针对业务的封装库都是这样,后期如果有新的业务,或者老业务上新的功能,封装库一般不会提供现成的解决方案,这时候就需要深入研究它的 API 甚至源码。这样的话上手成本就会高了很多。所以这种基于业务的封装库适用于短期高效开发,业务不复杂的场景。

拓展

还有一种开发 Web 端 3D 应用的方式,如 虚幻引擎4就有将项目通过打包成 WebAssembly 格式,从而开发 3D 游戏或应用网页。优点是性能上超过使用上述办法开发的 3D Web 应用,性能高的原因就是 WebAssembly 格式可以充分发挥浏览器端 JavaScript 引擎的执行效率,使其接近操作系统原生应用的效率。而上述方法其实也可以打包成 WebAssembly 格式从而达到性能优化,只不过需要学习和时间成本。

这种方式也有它的缺点:UE4 的项目打包成 Web 应用这种方式,存在的意义就是扩展应用的使用范围而已,因为它开发完成之后就已经可以作为桌命端应用交付使用了,它的开发周期和成本还是受到桌面端开发的限制。

总结

其实不同的库都有优缺点,但都有可取之处,归根究底还是靠业务来选型。如果业务大场景、重交互、需要优质体验,首选游戏引擎原生开发;如果业务简单,需要拓展 Web 平台,使用 Three.js 和其他封装库的意义就存在。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

(0)
上一篇 2023年5月17日 下午2:24
下一篇 2023年5月17日 下午2:40

相关推荐

  • 项目管理办公室的主要职责

    项目管理办公室是组织中一个重要的职能部门,其主要职责是协助项目经理和其他相关部门进行项目管理工作,确保项目按时完成,达到预期目标。 以下是项目管理办公室的主要职责: 1. 制定项目…

    科研百科 2024年9月27日
    20
  • 不脱离业务场景的低代码,才能成为 CIO“同行”

    文 | 周晓莉 前言:“新常态本身就是一种颠覆。面对现实、利用创新能力、技术和影响力的企业机构不仅可以生存,而且会因此成长。”——Monika Sinha Gartner 总裁分析…

    科研百科 2024年5月16日
    86
  • 江苏省小型项目管理师

    江苏省小型项目管理师 随着经济全球化的加速,小型项目管理师的需求日益增长。江苏省小型项目管理师是指在江苏省从事小型项目管理工作的人员,其职责主要是负责小型项目的计划、执行、控制和报…

    科研百科 2024年8月20日
    43
  • 内容项目管理

    内容项目管理:实现数字内容创新与增长的关键 随着数字技术的飞速发展,内容创作和分发方式也在不断改变。在数字内容领域中,内容项目管理已经成为了数字内容创新和增长的关键因素。本文将探讨…

    科研百科 2024年7月14日
    64
  • 科研项目文档和报告一样吗科研项目文档和报告一样吗

    科研项目文档和报告的区别是什么? 在开展科研项目的过程中,文档和报告是不可或缺的组成部分。它们分别代表了不同方面的内容,并且对于项目的进展和成果具有重要影响。本文将介绍科研项目文档…

    科研百科 2024年7月4日
    36
  • 新品|得胜DG-S200有线手拉手会议系统发布

    随着人们对办公的要求及会议环境愈加严苛,除了要满足传统简单的会议要求外,还应具备系统使用智能化、简单化,设备布线规范整洁、美观,运行安全稳定、会议秩序管理有序等特点。为此,得胜推出…

    科研百科 2022年10月14日
    185
  • 有什么软件或平台可以直播录屏呢?(有什么软件或平台可以直播录屏呢手机)

    直播录屏?想找一款分享屏幕的软件或平台,下面几款录屏软件是我使用过觉得还不错的宝藏软件了,不仅操作简单,功能也很强大,录制过程太丝滑了,绝对能满足不同人的使用需求! 方法一:手机自…

    科研百科 2023年4月16日
    311
  • 大学科研项目绩效考核办法规定(大学科研项目绩效考核办法)

    大学科研项目绩效考核办法 随着高等教育的迅速发展,大学科研项目已经成为高等教育中不可或缺的一部分。为了促进大学科研项目的健康发展,制定一套科学、公正、合理的绩效考核办法至关重要。本…

    科研百科 2024年4月2日
    374
  • 常用项目管理工具

    常用项目管理工具 项目管理对于组织的成功至关重要。通过使用各种项目管理工具,可以更有效地管理项目,确保项目按时完成,并达到预定的质量标准。以下是一些常用的项目管理工具。 1. Mi…

    科研百科 2024年7月22日
    46
  • 档案管理系统国产化

    档案管理系统国产化 随着数字化时代的到来,档案管理系统国产化成为了一个越来越重要的议题。档案管理系统国产化不仅能够提高档案管理的效率,还能够降低档案管理的成本,为政府、企业和个人提…

    科研百科 2024年9月24日
    24