Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Keeping Figma Fast: perf-testing the WASM editor

figma.com

Post reply on HN
Print view View original

11–20 of 99 posts

Re: Keeping Figma Fast: perf-testing the WASM editor

#11

Post by preommr »

drewda wrote: post #4

Occasionally I wonder what could have happened to front-end web application development over the past few years if Figma had open-sourced their WebGL-based GUI library. We've had ~15 years of focus on the DOM with the progression of jQuery to Backbone to Vue, and many other libraries. At least what I've heard of the Figma approach almost sounds like the Adobe Flash/Flex runtime. That might only make sense for applica…

It would not.

1. Wasm based UI libraries exist already, checkout makepad [0] for example.

2. Web app standards are way higher than when flash was around. I highly doubt there would be any serious discussion that would also involve vue/react as alternatives. Almost as ridiculous as asking about using unity ui vs react.

3. Flash was world class media design tool for animation and production design. People were using it to create tv shows. Figma is nowhere close in terms of alternatives like illustrator, adobe ae, etc. So it's value as a runtime for 'cool' effects would be very limited. Which is the only reason to not use html/js because otherwise there's all kinds of small usability issues (like things not scrolling right, or not working with mobile). Figma's biggest value is it's collaborative features which is really important for ui design. I think devs (and other non-designers) overvalue Figma's importance because of lack of famliarity. It's kind of like if people thought you could use google docs or notion as an ide. After all they're both text editors right, even if jetbrains or vscode is better, it's maybe 10-20% better? But of course devs know that they're world's apart, like comparing apples to oranges.

[0] https://makepad.nl/makepad/examples/ironfish/src/index.html

Re: Keeping Figma Fast: perf-testing the WASM editor

#12

Post by [deleted] »

drewda wrote: post #4

Occasionally I wonder what could have happened to front-end web application development over the past few years if Figma had open-sourced their WebGL-based GUI library. We've had ~15 years of focus on the DOM with the progression of jQuery to Backbone to Vue, and many other libraries. At least what I've heard of the Figma approach almost sounds like the Adobe Flash/Flex runtime. That might only make sense for applica…

[deleted]

Re: Keeping Figma Fast: perf-testing the WASM editor

#13

Post by maccard »

yeldarb wrote: post #2

Nice post. Figma's engineering blog looks great; right up there with Airbnb's and Etsy's which I also enjoy.

Airbnb is a great example of a terrible experience that just keeps getting worse. It makes my M1 Mac, my 32 core workstation and my top of the line android device chug.

Re: Keeping Figma Fast: perf-testing the WASM editor

#14

Post by imslavko »

yellow_lead wrote: post #10

Seeing a 20% margin of error for some of their tests (due to VMs, noisy neighbors), makes me curious how others solve this problem. Dedicated hardware seems like a good investment, otherwise you need to constantly overcompensate with multiple runs.

Hey, I am one of the authors of the article and the systems described.

The default 20% margin of error is indeed pretty wide, and it is intended to catch large obvious regressions (e.g. an algorithm accidentally becoming quadratic instead of being linear)

As we described in the blog post, we have the second system based on the real hardware. This system is on-demand. If an engineer has a suspect commit or an experimental change that might affect performance, they would schedule a 30min-1hr run on that queue, where we run selected benchmarks 9-15 times each on laptops of various strength. In this configuration, the margin of error is closer to 2-3% from our observations so far. To get more confidence, you would want to run even more trials, typically we advise 9 iterations, though.

We also do all our daily benchmarking on those laptops too.

Edit: in addition to preventative testing, we also track production metrics in a similar way as described by the sibling comment

Re: Keeping Figma Fast: perf-testing the WASM editor

#15

Post by imslavko »

drewda wrote: post #4

Occasionally I wonder what could have happened to front-end web application development over the past few years if Figma had open-sourced their WebGL-based GUI library. We've had ~15 years of focus on the DOM with the progression of jQuery to Backbone to Vue, and many other libraries. At least what I've heard of the Figma approach almost sounds like the Adobe Flash/Flex runtime. That might only make sense for applica…

It's worth noting that a lot of Figma's UI outside of the canvas is React (panels, toolbars, menus, etc).

Re: Keeping Figma Fast: perf-testing the WASM editor

#17

Post by jve »

bsder wrote: post #9
drewda wrote: post #4

Occasionally I wonder what could have happened to front-end web application development over the past few years if Figma had open-sourced their WebGL-based GUI library. We've had ~15 years of focus on the DOM with the progression of jQuery to Backbone to Vue, and many other libraries. At least what I've heard of the Figma approach almost sounds like the Adobe Flash/Flex runtime. That might only make sense for applica…

Figma was considered ... good? Every time I have used it, it feels incredibly laggy with a crapton of useless animations. Maybe it's better on Windows?

Not for me... well, I'm on Windows.

It is currently the best tool for me, as a non designer, to smash together (design) icons and export in my choice of format.

Re: Keeping Figma Fast: perf-testing the WASM editor

#18

Post by rozap »

maccard wrote: post #13
yeldarb wrote: post #2

Nice post. Figma's engineering blog looks great; right up there with Airbnb's and Etsy's which I also enjoy.

Airbnb is a great example of a terrible experience that just keeps getting worse. It makes my M1 Mac, my 32 core workstation and my top of the line android device chug.

The shininess of the engineering blog and the actual product seem to be completely disconnected. All the major players (Airbnb, Instagram, Facebook, Twitter) go on about all these often genuinely impressive perf optimizations, but if you actually try the product they're borderline unusable. It's pretty clear that the blogging is just a clout chasing exercise, but the cognitive dissonance is still palpable.

Re: Keeping Figma Fast: perf-testing the WASM editor

#19

Post by hifix »

bsder wrote: post #9
drewda wrote: post #4

Occasionally I wonder what could have happened to front-end web application development over the past few years if Figma had open-sourced their WebGL-based GUI library. We've had ~15 years of focus on the DOM with the progression of jQuery to Backbone to Vue, and many other libraries. At least what I've heard of the Figma approach almost sounds like the Adobe Flash/Flex runtime. That might only make sense for applica…

Figma was considered ... good? Every time I have used it, it feels incredibly laggy with a crapton of useless animations. Maybe it's better on Windows?

I use it daily on Windows and I have to say it seems pretty fast. Never noticed any lagging or unnecessary animations.

Re: Keeping Figma Fast: perf-testing the WASM editor

#20

Post by koenbok »

yellow_lead wrote: post #10

Seeing a 20% margin of error for some of their tests (due to VMs, noisy neighbors), makes me curious how others solve this problem. Dedicated hardware seems like a good investment, otherwise you need to constantly overcompensate with multiple runs.

At Framer (framer.com) we actually had a bit lower variance (I think it was closer to 15%) after spending three months of solid engineering, ending up with a dedicated Mac Mini running Chrome.

Apart from the admin overhead (things got stuck on OS updates) we ended up abandoning the setup because the variance was too big to get anything useful out of running tests for every pr.

The most reliable way for us to monitor performance today is to count slow frames (>16ms) across all actual users and divide them by total time spent in app. It’s a rough proxy, but pretty accurate at showing us when we mess up.

Post reply on HN