WebGL Safari 性能横幅。

Safari——特别是在 iOS 上——一直被认为是构建 3D 网页的开发者面临的性能挑战的顶峰。 WebGL 的基于 Metal 的实现,再加上 WebKit 独特的性能特性,使其特别值得关注。

在本文中,我们将为您提供一些关于如何提高 Safari 上 WebGL 应用性能的见解。

Apple Vision Pro 

随着最近 Apple Vision Pro 的发布,Safari 上的 WebGL 性能变得更加重要,因为 Apple Vision 版本的 Safari 继承了 MacOS 和 iOS 上 Safari 的所有性能特征。

我们将很快发布一篇关于 Apple Vision Pro 的 WebXR 的完整文章,订阅我们的新闻通讯以获取通知。

Wonderland Engine 在 Apple Vision Pro 上 

如果您已经在使用 Wonderland Engine,我们有好消息:我们为 0.9.0 版本 所做的所有优化都转移到了 Apple Vision Pro 上。

有权限使用 Apple Vision Pro 的开发者报告说,他们基于 Wonderland Engine 的应用在设备上表现出色:

针对 Safari 的优化 

如果您使用的是其他框架,请务必查看我们的 WebGL 性能分析博客文章。 该博客文章包含关于如何找到应用程序瓶颈以确定需要优化的内容的提示。

此外,以下是在分析时您可能在 Safari 中发现的一些注意事项。这些并非一刀切的方法,分析您的应用程序以找出哪些是给您带来麻烦的原因。

瓶颈 

以下是您在 Safari 上使用 WebGL 时可能遇到的一些更具特征性的问题:

Uniform Buffers 

由于 Apple 的图形 API Metal 与 WebGL 不同,Safari 需要在底层模拟一种 WebGL 风格的 uniform buffer。这种模拟使得预测 UBOs 的性能变得困难:某些使用场景可能没问题,而其他情况可能在不合时宜的时刻上传数据时遭遇 150ms 的停顿。

这个代码片段 来自 Angle 的 Metal 实现(WebKit 用它来实现 WebGL2 API),指向了与 WebGL 的 bufferSubData 相当的 GLES 的实现。 它帮助我们理解浏览器开发者为我们提供一致的图形 API 所付出的努力。 同时也展示了 Wonderland Engine 团队为您了解浏览器性能并优化的所作所为。

关于 Safari 花了很长时间才发布 WebGL2 支持存在很多不满。反对猜测他们可能永远不会支持,事实上他们在 2021 年 9 月的 Safari 15 中发布了 WebGL2 支持。 阅读 WebKit 和 Angle 的代码让人对完成这项任务的难度产生了共鸣。

WebGL State Access 

WebGL 的 getParameter 函数会带来一些性能令人意外的问题。看似无害的函数可能会消耗大量的性能预算。

WebGL Error 

尽管通过 getError 检查错误通常是个好主意,但请避免在帧回调之外使用它,因为它可能比预期更耗性能。

Memory and Limits 

WebGL Safari 会报告纹理大小、层数、uniform buffer 大小等限制。 一个查看这些限制的好工具是 webglreport.com

虽然 Safari 理论上允许您分配到这些限制,但您可能会发现这样会导致页面崩溃。

为了在 iOS 上更高效地使用内存资源,Wonderland Engine 提供了一项我们称之为 Texture Streaming 的功能,可以根据当前帧需要的内容动态地将纹理片段在内存中交换。这是默认启用的。

结束语 

不久后我们将跟进一篇关于 Apple Vision Pro 的 WebXR 的详细博客文章。 订阅我们的新闻通讯,在我们发布时获取通知。

在此之前,我们希望您尝试使用 Wonderland Engine! 特别是在从 Unity 转变过来的时候,Wonderland Engine 易于学习

请务必加入我们的 Discord 服务器,因为我们乐于为您指引入门的正确资源。

Last Update: February 9, 2024

保持更新。