Figma Rendering: Powered by WebGPU
a day ago
- #WebGPU
- #Figma
- #Rendering
- Figma has updated its renderer to use WebGPU, unlocking new performance optimization opportunities.
- WebGPU is the successor to WebGL, allowing for new rendering optimizations like compute shaders and better error-handling.
- The transition from WebGL to WebGPU required significant updates to Figma's graphics interface and shader processing.
- Figma's shaders were originally written in GLSL for WebGL but had to be adapted to WGSL for WebGPU, using a custom shader processor.
- Uniform buffers in WebGPU required a shift from individual uniform settings in WebGL to batched uploads for performance efficiency.
- The core implementation involved updating C++ code to work with WebGPU in both WebAssembly and native builds, using tools like Emscripten and Dawn.
- Performance testing and optimization were critical, with Figma monitoring metrics across various devices and OSes to ensure no regressions.
- A dynamic fallback system was implemented to handle WebGPU failures by switching back to WebGL when necessary.
- Future optimizations with WebGPU include using compute shaders for blur rendering and leveraging RenderBundles to reduce CPU overhead.