Does anyone have any resources that go deep into the stack/architecture used by the Figma desktop/web app?<p>I'm not so interested in the server based syncing/CRDTs side of things (great as that is) but more the layers that make up the web/desktop app.<p>What I'm particularly interested in is the roles and responsibilities across the various layers.<p>My understanding is that the app container is written in react and hosted via a browser or within an electron app. Then, most of the business logic is delegated to a WASM core.<p>However, my understanding of where the boundaries lie and how the various layers communicate are a bit fuzzy.<p>For example, which components are part of the Web DOM and which components are driven by Web GL? I'm guessing everything but the canvas (so menus, palettes, cursors) is part of the HTML DOM?<p>Then, business logic wise, how much work is done within the react app wrapper vs. the WASM core? Is the react layer used strictly for hosting the WASM core and rendering the UI, or does it take part in some of the business logic responsibilities also.<p>Would love to read or watch a deep dive into this if it exists somewhere.
Did you read through some of their engineering blogs? [0]
They might not give you direct answers, but could give some hints on how specifics work.<p>There is also a specific blog about their infrastructure [1], maybe this gives you a better idea? Next to that, you could simply try to get in touch with one of their engineers.<p>[0] <a href="https://www.figma.com/blog/engineering/" rel="nofollow">https://www.figma.com/blog/engineering/</a>
[1] <a href="https://www.figma.com/blog/under-the-hood-of-figmas-infrastructure/" rel="nofollow">https://www.figma.com/blog/under-the-hood-of-figmas-infrastr...</a>