我们重视您的隐私。我们使用cookies来提升您在我们网站的体验。使用本网站即表示您同意我们的隐私政策.

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 检查错误通常是一个不错的主意,但请避免在帧回调之外使用它,因为它可能比预期消耗更多性能。

内存和限制 

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

虽然 Safari 理论上允许您分配资源达到这些限制,但实际使用中可能会导致页面崩溃。

为了在 iOS 上更有效地使用内存资源,Wonderland Engine 提供了一项名为 Texture Streaming 的功能,根据当前帧的需求动态交换内存中的纹理片段。此功能默认启用。

结束语 

我们将很快推出关于 Apple Vision Pro 上 WebXR 的详细博客文章。订阅我们的新闻通讯以便在发布时收到通知。

在此之前,我们希望您尝试使用 Wonderland Engine!特别是如果您来自 Unity,Wonderland Engine 更容易上手

请务必加入我们的 Discord 服务器,我们非常乐意为您提供指引以启动项目的资源。

Last Update: March 28, 2025

保持更新。