Figma 渲染:由 WebGPU 提供支持

When Figma Design launched in 2015, most rich design tools were still native desktop apps. Betting on WebGL—a browser graphics API originally designed for 3D applications—was a bold move. WebGL wasn’t widely used for complex 2D applications at the time, but Figma’s team saw its potential to power a smooth, infinite canvas in the browser. That early bet on WebGL set the foundation for Figma’s performance and real-time collaboration capabilities.

2015 年 Figma Design 发布时,大多数功能丰富的设计工具仍是原生桌面应用。押注 WebGL——一个最初为 3D 应用设计的浏览器图形 API——是一次大胆的尝试。当时 WebGL 并未被广泛用于复杂的 2D 应用,但 Figma 团队看到了它在浏览器中驱动流畅、无限画布的巨大潜力。早期对 WebGL 的押注为 Figma 的性能和实时协作能力奠定了基础。

In 2023, Chromium shipped support for WebGPU, the successor to WebGL. It allows for new rendering optimizations not possible in WebGL—for instance, compute shaders that can be used to move work off the CPU and onto the GPU to take advantage of its parallel processing. By supporting WebGPU, we could also avoid WebGL’s bug-prone global state, and benefit from much more performant and clear error-handling.

2023 年,Chromium 正式推出了对 WebGPU 的支持,它是 WebGL 的继任者。WebGPU 带来了 WebGL 无法实现的新渲染优化——例如,compute shaders 可以将计算任务从 CPU 转移到 GPU,从而利用其并行处理能力。通过支持 WebGPU,我们还能避开 WebGL 中容易出错的 global state,并获得更高效、更清晰的错误处理机制。

This wasn’t an easy upgrade, however—we had to design the new rendering backend with performance in mind, maintain compatibility with WebGL while adding WebGPU support, and roll out our changes carefully to avoid breakages. What follows are highlights from the major phases of the project.

然而,这并不是一次轻松的升级——我们必须以性能为导向设计新的渲染后端,在保持与 WebGL 兼容的同时加入 WebGPU 支持,并谨慎地推出变更以避免破坏现有功能。下文是该项目主要阶段的重点回顾。

Updating our graphics interface

更新我们的图形接口

When we started the project to support WebGPU, Figma’s engine already had an existing interface layer between higher-level rendering code and low-level OpenGL—but the interface mapped closely to the WebGL API. We had to implement several key improvements to modernize our interface and ensure that the transition to WebGPU would improve performance, not regress it.

当我们启动支持 WebGPU 的项...

开通本站会员,查看完整译文。

首页 - Wiki
Copyright © 2011-2025 iteam. Current version is 2.146.0. UTC+08:00, 2025-09-20 05:19
浙ICP备14020137号-1 $访客地图$