Introducing BrowserView for Electron | Figma Blog (opens in new tab)
Figma introduced BrowserView for Electron to address the performance, stability, and feature bugs it experienced with `<webview>`. BrowserView embeds web apps at the operating-system window level, similar to Chrome tabs, allowing them to perform more like native Chrome content. Although it requires manual positioning and layering, Figma found the trade-off worthwhile and shipped it in Figma Desktop 2.0. ## Why Figma Chose Electron - Figma uses the web to make its design tools broadly accessible. - Its desktop app is built with Electron, extending the web experience to desktop platforms. - Figma had already improved performance through technologies such as WebGL and WebAssembly. - The company also contributed fixes and improvements to Electron and Chromium. ## Problems with `<webview>` - Electron commonly uses `<webview>` to embed remote web applications. - Unlike an iframe, a webview renders content in a separate process, improving security, stability, and performance. - Over time, Figma encountered: - Drag-and-drop bugs - Performance below that of Chrome - Other fundamental reliability issues - Because webview is implemented inside Chromium, fixing its underlying problems would require major Chromium changes. - Figma and Electron maintainers therefore chose to develop an alternative rather than continue waiting for Chromium fixes. ## How BrowserView Works - `<webview>` exists within the page’s DOM hierarchy. - BrowserView lives in the operating system’s window hierarchy, much like Chrome’s browser tabs. - This design benefits from the more mature and actively maintained code paths used for Chrome tabs. - BrowserView eliminates many webview-specific bugs. - Applications embedded through BrowserView can perform similarly to applications running directly in Chrome. ## Trade-offs and Adoption - BrowserViews cannot be positioned or layered using ordinary HTML and CSS. - Developers must manually manage their size, location, and stacking order. - This can be difficult for applications with complex interfaces. - For Figma, converting to BrowserView was relatively straightforward. - At the time of publication, BrowserView was experimental and still planned for further refinement. Figma recommends BrowserView as a promising replacement for `<webview>` when improved performance and reliability outweigh the added layout complexity.