使用游戏引擎制作 3D Web 应用程序

xiangtingsl · 发表于 2022-2-14 09:15

我们使用 Web 应用程序开发中使用的传统工具 - 后端和前端框架、JavaScript、WebGL 等，从头开始研究了构建客户端-服务器 Web 应用程序时的技术注意事项。这次我们将采取看看两个工具，它们可以帮助开发人员减少对 Web 应用程序的特殊性的关注，并在 3D 应用程序上工作，然后稍微努力将其变成一个 Web 应用程序。
统一游戏引擎

Unity可能是目前最热门的游戏引擎，为许多商业游戏和爱好项目提供支持。Unity 功能齐全，相对容易上手，最重要的是免费用于个人甚至小型商业项目。但它不仅用于游戏。游戏引擎中固有的强大 3D 显示功能也非常适合工业应用，这就是为什么许多公司使用 Unity 创建应用程序来操作 CAD 和 3D 数据以进行协作设计审查、人员培训、产品展示和其他可视化场景 -通常以 VR 和 AR 应用程序的形式出现。
基于 Unity 的工业应用的注意事项

作为一个游戏引擎，Unity 有一个特定的工作流程。它有一个运行项目业务逻辑和渲染的事件循环。这意味着事件处理代码必须快速不冻结整个应用程序。如果有任何计算量大的操作，则必须将它们卸载到单独的线程并异步运行。另一点是开箱即用的 Unity 无法在运行时加载以前看不见的模型。这是因为游戏通常使用一组固定的资产，这些资产在构建应用程序时都可用。在运行时加载 3D 数据需要在上述事件循环中运行代码。
使用 Unity 的 Web 应用程序

Unity 支持多种目标平台：桌面和移动操作系统、游戏机 - 以及WebGL。要创建 WebGL 应用程序，必须在 Build Settings 中选择 WebGL 作为目标平台。然后运行构建过程会生成一组文件，这些文件可以用作 Web 服务器（或 CDN）的静态内容。如果没有必须在 Unity 之外实现的其他要求，则 Unity 开发人员可以在没有丰富 Web 开发经验的情况下创建功能性 Web 应用程序。

图 1. Unity 中的 Build Settings 窗口，其中可以选择 WebGL 目标。
Unity 不生成任何服务器端代码。为了在浏览器中运行应用程序，Unity 将其运行时编译为WebAssembly二进制文件，该二进制文件利用浏览器 API（WebGL、音频播放、游戏外围输入、Web Sockets等）来执行引擎的职责 - 3D 显示、音频播放、输入处理、网络通信等。在事件循环中运行的客户端代码是用 C# 编写的，但也被编译为 WebAssembly（通过中间转换为 C++）。
图 2. Unity WebGL 构建过程总结。项目组件以适当的方式打包，以便在浏览器中执行。

默认情况下，生成的 Unity 构建是完全独立的。但是可以使用客户端和服务器端代码来扩展它。Unity 脚本和 JavaScript 代码之间支持双向调用（尽管它们需要一些样板文件才能启用）。开箱即用支持与服务器进行基本交互以下载资产，更复杂的交互可以通过 Unity 的网络功能实现，也可以通过调用可以执行服务器请求的 JavaScript 代码来实现。
Unity Web 应用程序的限制

综合考虑，浏览器似乎是一个非常实用的 Unity 应用程序执行平台。Unity 的大部分功能都可用于 WebGL 构建。以下是最重要的限制：
记忆

在浏览器中加载 Unity 运行时后，会为整个应用程序分配一大块连续内存。这个块可以增长（虽然不大于 2 GB），但如果浏览器没有足够的内存，尝试这样做可能会失败。应用程序的所有对象和资产，包括您需要在运行时加载模型的对象，都必须驻留在那里。所有这些因素都意味着对您的应用程序的复杂性和您可以使用的 3D 数据的复杂性有一个软限制。
浏览器支持

Unity 声称支持所有主要的桌面浏览器，但官方并未支持移动浏览器。此外，由于浏览器中 API 实现的级别不同，其中一些可能不允许使用某些功能，或者性能可能比其他浏览器更差。最值得注意的是，Apple 的 Safari 不支持 WebGL 2.0，因此 Unity 在其中运行时被迫回退到 WebGL 1.0。
多线程

WebAssembly 目前不支持稳定浏览器中的多线程计算，因此 Unity 运行时和客户端 C# 代码都不能利用线程进行计算。
PlayCanvas 游戏引擎

PlayCanvas是另一个游戏引擎，也可以用来创建 3D 生产力应用程序。与 Unity 不同，它是从头开始创建的，目的是为网络创建 3D 游戏。它具有游戏引擎通常所期望的所有功能——支持渲染、音频播放、输入处理、场景和资产管理、脚本等。有一个编辑器可以快速创建场景。但很自然，它使用 JavaScript 作为其脚本语言，并且引擎的运行时本身是作为 JavaScript 库实现的。

图 3. PlayCanvas 编辑器具有游戏编辑器的所有必要属性：3D 视图、场景图和资产面板、对象属性和附加组件列表。

PlayCanvas 提供了一些托管选项。使用它构建的应用程序可以由 PlayCanvas 本身托管，然后简单地为其分配一个 URL，您可以从您的网站链接到该 URL，或者只是嵌入到 iframe 中。这是一种低维护方法，无需丰富的 Web 开发经验即可获得 PlayCanvas 面向 Web 的优势。对于更高级的用户，还可以下载整个应用程序并将其托管在您自己的服务器（包括 CDN）上。
PlayCanvas 的运行时是一个浏览器原生的轻量级 JavaScript 文件。因此，与 Unity WebGL 构建相比，PlayCanvas 应用程序能够显示显着更小的包大小和更快的启动时间。原生运行还允许浏览器 JavaScript 引擎根据当时的需求更有效地利用内存。所有这些因素结合在一起，使得 PlayCanvas 应用程序可以在各种移动浏览器中的移动设备（手机和平板电脑）上很好地工作。
PlayCanvas 的缺点对于一个更年轻、更小众的项目来说是相当标准的——它无法匹配 Unity 的功能集和平台支持，也没有庞大的资产商店和与之集成的各种商业产品。特别是，在运行时加载 3D 数据以及引擎不支持开箱即用的格式需要使用额外的软件（在服务器上或通过 API 调用）。
概括

这次我们简要介绍了两种能够以不同方式生成 3D Web 应用程序的工具，更多地关注 3D 应用程序开发而不是 Web 应用程序开发。如果应用程序需要用户帐户和共享等集中功能，这些工具本身将只负责客户端和服务器端开发，看起来应该与使用通用 Web 技术构建的通常客户端-服务器 Web 应用程序一样。否则，这些工具可能对没有太多 Web 开发经验但具有 3D 应用程序开发背景的团队很有用。

		自动登录	找回密码
密码			立即注册

使用游戏引擎制作 3D Web 应用程序

本帖子中包含更多资源