Why the web wins: A Fireside Chat with Kris Rasmussen and Matt Biilmann

Kris Rasmussen, an engineer at Figma, explains how the company built a browser-based design tool using WebAssembly and WebSockets. Figma started with a custom language compiled to asm.js, then moved to WebAssembly as it matured, enabling real-time multiplayer collaboration that desktop tools couldn't match.
Chapters
Welcome, Kris. Great to have you here.
It's great to be here. This is my first in-person developer conference in a very long time, so it's great to see all of your faces.
That's amazing. That's amazing. And, um, I've been really excited about having you here because to me, Figma has always sort of seen like one of the most impressive examples of taking something that people a while ago would have thought was impossible to do as a web application. And then not just doing it as a web application, but also completely like winning their, their, the space of design. Like all of our designers are using Figma every day now, and most of what we build up starts, starts its life in Figma. And I'm sure if 10 years ago I've told those same designers, like, you are going to replace all your heavy desktop apps with just going to a URL in a browser, they would not even have believed me. So you were part of like the early, early journey there of, of, of Figma starting to, to build something that people at the time would've thought this, this must be impossible. What, what prompted, what prompted that journey and what got you started there?
And yeah, so I think, um, some context is, is probably good to start with. So I joined Figma about a month before the product was launched publicly.
Yeah.
And to be honest, so I joined as a contractor. I was just really intrigued by what they were trying to do, and I was also a little skeptical at the time as to whether or not it would be fully possible. But the team blew me away, like in the first week I got to work with them. It was just clear that, that they were really onto something. And I think if you were to reach out to Dylan and Evan and ask them the same question, they would have to come clean and, and admit that they actually hedged their bets in the early days. So the first version of Figma was based on a programming language that Evan had created on the side. Of course, it cross-compiled, uh, a TypeScript-like language kind of in the early days of TypeScript before it was fully mature into JavaScript and C++ and eventually ASM and C++. And so, um, it wasn't clear, I think, when the company got started that this was possible, but they, they were really betting on the, um, the work that the browser companies were doing. To, to build these lower level abstractions and give us, uh, you know, sort of an out when the, the core kind of abstraction layers that the browsers have been based upon for decades weren't good enough. And, and fortunately it, it worked out really well. So that, I think that's, that's kind of how we got there. And I think that one of the reasons it worked out so well is in, in this kind of new emerging space of product design, there's this big shift from design being this sort of static asset that you hand off, right, to a printer or, maybe even just like a fixed form website in the early days of design to this thing that's like living and breathing alongside the code and needs to constantly evolve and change and is just inherently a lot more collaborative. And so even though there, you know, there always will be some limitations with the web, those limitations weren't enough that, that, you know, you couldn't get the benefits of the web. And these lower level abstractions that browsers started to provide gave us the opportunity to build this product.
What do you think was sort of the first moment where you started building belief like, hey, this, this might actually work on the web?
Yeah, well, I mean, the first thing was, uh, so I, I took like a little bit of a sabbatical before working at Figma. And that's why I started off as a contractor. Um, I was doing a lot of work in kind of graphics and physics engines and kind of exploring the future of VR and just having fun, to be honest, and, and kind of digging really deep. And so I had a sense for like what it took to build really high performance graphical or like computationally intensive applications. And, um, what, what really made me believe was one, I got to use the product and even, you know, at the beta launch, there were definitely things that could be faster. but I had the ability to look at the code and see that those, those things that could be faster weren't actually being limited by the web. They'd just be limited by the, the structural nature of the application or the way we had written the code in the early days. And I was just really impressed. Like it was, it was amazing what the team had already done. And I also got to see that it was just an incredibly high aptitude team that I myself believed in. And it just felt like a, an awesome mission to go not only like, you know, change the, the world of product design, but also prove that the, the web is like a viable platform for a new breed of applications.
What do you think was the, what, what parts of the web do you see as like really the core parts that, that make Figma also take so much, uh, of the market share for, for product design and design in general?
Yeah, I mean, so I think, um, I personally think like the web and, and native platforms are converging on some level, right? Over time. I think if you look at it, they both kind of came from very different extremes, right? Like Desktop operating systems are like, you know, first just, just these like low-level abstractions over the hardware and developers are kind of building these renderers and type systems and all these like primitives that we take for granted today on top of that. And the web came along kind of approaching the opposite extreme. It was really focused on, you know, distributing information and, and, and, and whatnot. And it started with these higher-level abstractions that were optimized just to kind of get that information distributed as quickly as possible and You know, there were obviously, um, bandwidth constraints at the time. There still are today. Fortunately, not, not as extreme. Um, and so I think, uh, I think that, uh, ultimately like these two things are now starting to converge, right? We're starting to build lower level abstractions on the web. Um, and that's making it possible for us to, to build these more performant applications or work around some of the things that the, the core abstractions can't do yet. Um, and we also getting to take advantage of this distribution model and the security model that people trust. And this link sharing metaphor that everyone intuitively understands. And that, that gives us the ability to kind of reimagine a certain class of applications that, that, you know, previously weren't possible.
Yeah. You also really pioneered in many ways, like the idea of multiplayer applications and live, live applications. What were some of the breakthroughs you needed to, to, to build with that? And, and what are some of the tools you think have emerged now that makes that easier for, for other teams to go and, and implement? Yeah.
Um, yeah. Another kind of thing that a lot of people didn't believe is that, that design needed to be multiplayer.
Yeah.
I think if you actually look at early tweets from when we launched the product, people were like, if this is the future of design, I'm done.
Yeah.
Um, so that, that definitely took a leap of faith for the team to bet on. Um, and fortunately it played out well. But I, but I think like for that, I mean, I think WebSockets definitely makes it possible to build this like near real-time experience and just the web, you know, being kind of based in the cloud, if you will.
Yeah.
By default is just a really great place to start when you're trying to build collaborative applications. It creates this single source of truth. It's like one URL that everyone can reference to get on the same page about what everyone's looking at and see the same thing in real time.
Yeah. And what about WebAssembly? So that, that also seems to be one of the technologies that came around at the right time to, to, to make, to make Figma viable. How big of a role did that play and, and how big of a role does it play today in, in Figma as a, as a viable application?
Yeah, I mean, just to, to cut to the quick, it, it plays a huge role in our product development and our success today, but it actually didn't exist when we launched the product. Yeah. Or at least it wasn't mature enough for us to bet on it. Um, Figma actually started off with ASM.js as the compilation target. And that, that was actually good enough to, to start to get some traction and start to grow the business. Um, but ultimately once WebAssembly matured and, and we started seriously exploring it, it provided us with a whole nother level of performance. And there were some quirks to work out in the early days of WebAssembly, but We fortunately have a lot of browser companies as our customers, um, designing their own products. And so we got to build a relationship with them and, and help, you know, get, get some of these things fixed so that, uh, some of the startup times that were inherently problematic with WebAssembly at first, um, got a lot better.
What were some of the big challenges in that journey? I'm sure there must have been moments where it's been like, yeah, pretty deep technical problems you had to dig through to, to really make this work.
Yeah, I mean, well, so the first thing to, to realize is that we actually, for, for the longest period of time, and even to some extent today, still debug our application natively. It's a really weird way of building a web application. Um, and in the early days of Figma, the entire application was written in C++, even the UI layer. And we've since like migrated a lot of that stuff to standard open source technologies. Um, but one of the challenges with like asm.js and WebAssembly is that source maps just weren't mature enough, didn't really exist when we started. And so it was actually really hard to debug these things on the web, right? It, you, you couldn't really step through code. Um, you couldn't really make sense of these like error stack traces and whatnot. And so we actually had to develop them natively in Xcode and then cross-compile them to asm.js and eventually WebAssembly. And, and so one of the big leaps was just getting source maps. I mean, I think that's like unlocked so many new avenues of creativity and, and programming languages and, and development kind of workflows that, that previously people just wouldn't have considered. Um, so yeah, so that was one of the big ones. And the other one was just caching of the actual compilation target rather than just caching the initial WebAssembly payload, um, to, to shorten that kind of startup time.
Yeah. Do you think, I mean, when you look at a lot of other tools on the web that are sort of more, more traditional CRUD-based applications and so on, we've seen like very, like robust component library frameworks emerge and sort of solid meta framework emerge that, that makes it relatively easy to think about, okay, if I wanna build one of these, I know where to start and how to go. At the same time, it feels a little different with the type of application that, that, that Figma is like, there might be less of sort of an out of the box, this is how Figma did it. Go, go, go build your own kind of fully multiplayer, um, dynamically designed application. Um, What are, are there any tools you've seen that, that, that you sort of think like, okay, this, this really mirrors like the kind of tooling we've built internally, or anything you think makes it easier for people to build those types of applications today, or anything you think someone should build that to make it easier for, for the whole ecosystem to sort of innovate in this area?
Yeah. Um, I, I saw some of the talks and I, I think a, a lot of the talks really speak to, to some of these things that, that should exist. Today. Um, for me, like I've spent a large portion of my career building kind of the backend real-time fabric for these new applications like Figma and Asana and things like that. And I, uh, I think that we do need to kind of start to look for these, these kind of different abstractions for the end-to-end client-server journey in order to build this like kind of next breed of, uh, real-time optimistically updating, you know, fast to download offline accessible application. I think there, there is a need to kind of diverge from the, the kind of standard world of just like use REST as it is. I mean, I think for a lot of use cases it's totally fine, but I, I think there's an opportunity to innovate here. And, uh, and it's really exciting to see, you know, companies presenting here today that are doing that. And, and also a lot of other companies that I've been talking to around the web.
Anyone you're excited, like especially excited about, or like any projects you think like these, these are, these worth keeping an extra eye on?
Yeah. Well, so for, for me, like, um, within Figma, we actually have this framework called LiveGraph. And, um, you know, I spent all my career building these kind of higher level frameworks at companies before a lot of the new modern breed of frameworks existed. And so, um, I think like, for example, I think GraphQL is like a really interesting way to build APIs and make them more type safe and, and more composable and that sort of thing. And that's something that like, you know, I've seen companies build themselves before it existed. But I don't think GraphQL goes far enough.
No.
I think that, um, you know, we built LiveGraph because we wanted to have our API not just like add type safety and composability to all these different backend services, but we also wanted to explore a schema that was rich enough to actually express relationships between services. Mm-hmm. So that we can actually reason about the security boundaries of these different data models across different data stores and build these kind of composable, real-time by default, secure by default, optimistically updating by default, Um, sorts of applications. And, uh, and so we're excited to hopefully someday open source that. We'll get there eventually. But I'm also really, really excited to see other people in the community building similar kind of frameworks that have similar aspirations and goals. Unfortunately, I'm not good enough with names, so I can't reference them all right now. But I know that they're, they're out there and I'm sure they'll watch this. And I, I honestly am just rooting for the web and I'm, I'm rooting for just kind of continuing to push the, the kind of default level of performance and offline accessibility and all these sorts of things for web-based applications. So any framework doing better is, is good by me.
Do you have any sort of big remaining wishlist items for the browser vendors, for the web that, that you feel like if only we had this?
Yes. Um, I definitely have a long list of wishlist items. I mean, I know that like first I think it's worth acknowledging that not every application and certainly not every developer in this room needs to be betting on these lower level abstractions that the web is now providing. Like WASM is not for everyone. The reality is most people are not gonna kind of go rebuild their entire application at, you know, a low level of abstraction, but you might actually start to compose libraries that leverage these abstractions, be it for some sort of computationally intensive workload or some graphical workload or maybe some machine learning workload. Um, so yeah, so I, I think that, uh, I actually forget the original question, so I'm gonna completely give you—
it was more about the browsers. Um, what, what's sort of top of your wishlist for them to still like—
yes, thanks for getting me back on track. So I, I think that for me, like within Figma, we have a very like nuanced wishlist that's not gonna apply to everyone. I mean, the first thing is one of the reasons why we do use WebAssembly is we have to use a lot of kind of C++ libraries that browsers and operating systems themselves use to access fonts, right? To like really get at the, the outlines of fonts and the geometry of fonts and whatnot. And honestly, like we'd rather not do that. We'd rather browsers provide APIs and abstractions so that we can just directly access those fonts without embedding all of this additional payload into our, our initial download size. So that's one area. And then, um, I also just like personally am rooting for these lower-level abstractions in browsers, even if it's not appropriate for everyone here, because I think it always gives us an out, you know, it always gives us an edge to, to kind of figure out how to, to build the next kind of, um, uh, type of application that the browsers themselves might not be optimizing for. And so to that end, I think, um, providing these lower-level GPU interfaces is a really important next step. So things like WebGPU, I think, are, are really critical, and I'd love to see that you know, get, get adopted and, and released by all different browser vendors.
Yeah. Have you seen like a cycle where some of the lower level primitives you had to build yourself then later got implemented by browsers that you could sort of start switching to the default implementation?
Uh, I think there definitely is that cycle. So I think, uh, in the early day, I mean, so first off, like, uh, Figma files always get more complex. Our users are always pushing kind of you know, more, more screens, more designs, more pages into them. And so even though it may not always feel like Figma's getting faster, we're constantly trying to make Figma faster to deal with this like increasing file size, increasing complexity, and, and trying to figure out ways to incrementally, um, load them. Uh, but, uh, at the same time, we also always look at like the, the evolution of kind of the browser's own rendering stack and its own capabilities with, you know, just running on top of the JavaScript virtual machine that it provides. And we have seen like the renderers for the, the browser get a lot faster. So there's some things that like we can render now when converting directly to HTML and CSS that in the early days of Figma just like would never have worked and, and now actually do kind of work. It's not all the way there for our unique use case of viewing 100 screens at once and zooming in and out, but it's a hell of a lot better than it was when we started. And so we're definitely rooting for, for browsers to, to get better too, so that, you know, we don't always have to reach for these lower level abstractions.
And how's it been doing? Like, one thing is that people would think that it's impossible to do this kind of traditional desktop application on the web, on a desktop. But you've also sort of had to, to do it on people's mobile phone and making that experience work. Like, which is also one of the unique components of the web, right? Like that, that there isn't sort of one web device, right? Like there's all these different browsers and devices and ways to approach your product. How's, how's it been thinking through all those different, uh, access point and formats and device types?
Yeah, I mean, that's definitely been hard. So, uh, one thing to note is that we didn't start with ASM.js or WebAssembly for mobile devices. Um, this is part of the reason why Evan created Skew, this like kind of cross-compiling programming language in the early days. He, he also wanted to create a, a JavaScript compiler. That was an optimizing compiler, um, as opposed to TypeScript. And so in the early days of Figma, we, um, we were actually building a separate prototype codebase from the core kind of editor desktop codebase. And to some extent we still have that today. It had its own renderer. Now we've unified the renderers, but it still has its own runtime that's largely JavaScript based. Um, and so, uh, it, it has actually been really hard to, to make sure that, you know, these large files that load on the desktop can also load on mobile devices. And, you know, to your previous question, um, WebAssembly was pretty far behind when it came to mobile targets. And that's something that's gotten a lot better as well. And so, um, these days we're, we, we don't think that the, the web on mobile is necessarily the primary limiting factor. The primary limiting factor for us is trying to think through how do we help our users who are building, you know, not necessarily building for production, right? They're building so that they can rapidly ideate and brainstorm with each other. They're not thinking about like how complex what they're building is. And we're trying to figure out how to like remove that complexity and stream that application or stream that design to mobile devices in a way that we kind of stay within the memory limits and the performance limits of those, those mobile devices.
What would you say to, to people in the, in the audience that are thinking of starting to, to, to build the next, the next interesting thing that we thought couldn't be done in the, in the browser before?
Yeah, I mean, I think that a, a lot of the opportunity right now in the web world related to kind of this, this interview and this talk and, and these lower level abstractions and new browser APIs is gonna come from trying to reimagine desktop applications, right? Like I think it's not about just taking a desktop application and porting it to the web. That, that's not necessarily the way to win here. I think you have to think about like, what are the strengths of the web in terms of the distribution model, the single source of truth, you know, the, the, the, the metaphor that every person understands around You share a link, anyone can view it. And how can you kind of rethink a lot of these different desktop applications that previously couldn't be built on the web that now can be built on the web, but also like actually make them different and better and, and more interactive and more collaborative and, and more viral.
Yeah. What do you see as some of the, like, I mean, Figma has also probably changed a lot how the collaboration between designers and developers work, especially for all of us building products and so on. Um, do you have any thoughts on what's like the next frontier for that?
And, uh, and yeah, yeah, this is definitely something we, we think about a lot. I mean, um, for, for the record, I think that, you know, from day one we've always thought of ourselves as building software for entire product engineering and design teams, not just designers, right? It's, it's a very collaborative process. Yeah. You know, we wanna make design accessible to all and, and that's because it's important to all of us. And so, um, a big part of that is, is, um, thinking about the relationship between design and engineering, right? There's this, this constant tension where us as engineers and, and, you know, sometimes also designers, we're, we're trying to think about like all the different inefficiencies in that process and how to streamline it. And sometimes we think about like bringing those two things closer together, right? Like, why do you have to design in one tool and then deploy in another?
Yeah.
Um, but I think there's, there's something fundamental about design versus engineering that we also need to embrace, right? Like, Design isn't just like a different profession or whatnot. It's, it's a different kind of mode and, and journey in the product development lifecycle. You wanna be able to rapidly ideate and iterate and brainstorm. Um, but at the same time, you also wanna optimize that, that kind of delivery to production. You wanna try to streamline it, remove the tedious parts of it. And that's something that we're really excited about.
Yeah. And where do you think that barrier will, will shift towards? It's like component systems that you wanna like take as the, as, as the piece that makes it across, or?
Yeah, well, I think we're already seeing it starting to kind of, um, get better or, or, you know, converge in some sense through design systems, right? Design systems are the, this like kind of common abstraction, common language that design teams and development teams work on together. Um, and they help to kind of eliminate some of the, the tedious accidental complexity that comes along with, you know, those two functions being totally separate. And, um, and I think that what we're gonna see over time is as design systems themselves get more powerful, you know, as you try to kind of create these composable reusable components within the design files themselves, that the, some of the kind of complexity of production or of code is, is gonna inherently have to come into the, at least the design systems team. And they are in a position to kind of get these economies of scale and leverage. And so we, as like a, you know, a product design tool can actually start to benefit from some of that and, and bring some value back to the user. Yeah. By trying to create, um, a more seamless handoff to development or, you know, even eliminating handoff in some cases altogether.
Yeah.
Yeah.
I think there's a ton of power in, in reducing the friction between the different teams working together. But I really liked your point also around like understanding why they're different, right? Like another area that I'm sure everybody is, is, is curious about today, seeing all the, the generative AI projects around like image generation and the text generation and so on. It's like from, from the perspective of, of a toolmaker for, for designers and so on, are you thinking about like how, how to integrate those kind of capabilities into the product? And is that something that's on your mind?
Yeah, I mean, I don't think there's, there's probably a company in the world right now that's not, no, not thinking about it on some level. It's hard to ignore what's happening there. Um, I think from, from our perspective, we're, we're super excited. We've been following the space. I think it's just like really, really incredible to see what's happening right now. And just the, the rapid click of clip of advancement. Um, but we are, we're thinking about it less so in the context of, you know, just general pixels, right? Which is like what a lot of these sort of diffusion models are that are popular right now are, are focused on. And we're thinking about it more from the perspective of like our own file formats and this, this more kind of vector structured data.
Yeah.
Which is actually a very, very different problem.
Yeah.
Um, so we're, we're definitely excited about the space and excited about what's happening, but we, we're thinking about it more from the perspective of product design specifically and and trying to innovate a little bit more there.
Yeah. Yeah. And any hints on what's, what's next for Figma?
Yeah, I mean, I think, I think that the, the area that, uh, I've been hinting at throughout this, this, uh, this interview is, is really just thinking about the end-to-end journey. Um, you know, we released this product called FigJam, uh, a little while ago and, and that was really about, you know, getting earlier in the, the thought process, really focusing on the brainstorming phase, which I think is a very inclusive part of the end-to-end product development process. Um, but I think the, uh, the, the kind of, you know, conversion to code or the, the shipping and iterating of the actual production application is also obviously a very important part of the product development process. And so I think we're, we're very focused on thinking through how we can bring that kind of end-to-end journey closer together and, and really create an inclusive product development process inside of our tools.
Yeah. Yeah. Very exciting. What are, when, when we go back to, to where it all started around building this kind of tools for the web, what, what are some of the core things that, that defines the web to you and that, that, that really makes the web stand out as a, as a platform from, from all the other platforms we have available and can build for?
Yeah, I mean, I think, I think the thing that the aspirational part of the web that I think a lot of us are drawn towards is the openness of the web, right?
It's, Yes.
It's the fact that it's, it's not exactly controlled by any one entity.
Yeah.
Um, and it's this thing where it's also like attractive as a developer because it's this thing that runs across platforms, across devices. Yeah. Um, you, you sort of have this like cross-platform abstraction layer that is awesome cuz none of us really like rewriting applications over and over again. Um, so I think that's like core to the web is, is, um, you know, the, the, the way in which it's sort of ubiquitous. Um, and then I think the other aspects that are core to the web are, are this like kind of seamless distribution model, right? Like the web started with this, like, this like smaller domain that it was trying to solve for. And, and, and really, you know, as a result got security mostly right, um, from the get-go. Whereas, you know, the, the sort of native land was really all about exposing all the power of the hardware. And we, we had like a history of a lot of kind of security missteps and everyone's really thoughtful about what they're installing. And it's also this heavyweight process, whereas the web is this white lightweight process. And so I, I think that, um, you know, the, the kind of seamless distribution model and, and the trust that the users have in it, um, the link sharing paradigm, uh, and the, the kind of ability to write code and run it everywhere. Those are the things that are really core to the web and, and really exciting to me.
What was the first thing in your life that made you go, wow, this, this web is really, is really something.
The first thing. Oh gosh, I, I actually haven't been asked this question before. My answer's really silly. I like literally remember just like sitting for 40 minutes watching a picture of a mountain bike trail load when I was a kid, like on dial-up and just being like, this is amazing. Like I can like access any picture of this thing that I really like and I don't have to go buy a magazine or something like that. Um, but I, I think it's like, it, it really is just like the, the distribution and accessibility model of the web and, and the way in which, you know, you're not afraid, like it's kind of like this, this idea of like differences in degree yield differences in kind. And I think Because we assume that, you know, everything on the web is mostly secure and, and is gonna be kind of easy to access and quick to access and is discoverable. We're, we're just like willing to explore it in a way that, you know, we haven't previously been able to do. And so that's kind of my first memory is just being like, just being blown away by like the amount of content that I can access.
Yeah. I think one of my early moments was like copying way, way back when this was very much simpler than today's CNN's website. And making like a, a, a, a dynamic version of it for some computer game with like game news. Oh yeah. And feeling like, wow, like I'm just some random guy like hacking this together, but it looks just as professional as if like if it was CNN that had made it, right? Like there's something pretty democratizing around that, that today anyone can create something and instantly get it in front of all of the world. And technically you can't really know if it's some random person doing it or if it's like a, a large team of people working on it.
Yeah, that, that's exactly right. I totally agree.
Yeah. Yeah.
I remember like my proudest moment in my, in the early days of my career was creating like a reorderable drag and drop list in the, in the very early days of interactivity on the web. And I was, I was so proud of that. And now it's just like so basic.
And now you build Figma.
Yeah. A lot of people build Figma.
I know, I know. But still. You had a pretty big role in it and, and, and it's been something that I think has really changed a lot of people's perception of, of, of the web as a platform and also changed, changed the world for a point where I think like not so many years ago there was like Wired articles about the web is dead and the, like it's all gonna be native apps, social media and so on. Right? Like, and, and, and today it's kind of almost the opposite. World we are living in and, uh, Figma has been a big part of that journey for sure.
So it's been a lot of fun.
Thank you so much.
Thank you. Thanks everyone.
Thank you very much.
Thanks, Matt.
More from Kris

Config 2024: The future of design to code in a world of AI (Kris Rasmussen & Meredith Black, Figma)
