Skip to main content
Question

Optimizing Asynchronous Node Processing in a Figma Plugin

  • November 26, 2024
  • 1 reply
  • 108 views
Alfonso_Chavarro

Hey everyone 👋. I’m pretty new to Figma plugin development and I’ve hit a wall. I’m working on a plugin where the main task is processing nodes when the user selects them. The problem? Figma freezes for a while when it runs, and it’s driving me nuts.

Here’s the deal:

  • The processing is all in the code.ts file because I need access to all the node properties. I haven’t moved anything to the ui since it doesn’t give me what I need.
  • I tried using a Web Worker to handle some of the heavy lifting, but realized code.ts doesn’t support Web APIs, so that plan flopped.
  • Right now, I’m using a Promise.all to process everything asynchronously and skipping invisible nodes to lighten the load. It helps a bit, but it’s still not enough to stop Figma from freezing.

The big bottleneck is one function doing all the work, and it’s just too slow. So here’s what I’m wondering: how can I handle this kind of async processing better without locking up Figma? Also, is there a way to show some kind of loading screen or progress indicator while the function runs so it’s not just stuck?

Any guidance or suggestions would be greatly appreciated! Thanks

This topic has been closed for replies.

1 reply

Pavel_Kiselev
  • Pavel_Kiselev
  • Power Member
  • 438 replies
  • November 28, 2024

I use simple delay function, like this

function delayAsync(time) {
    return new Promise((resolve) => setTimeout(resolve, time));
}

async function processLayers(nodes: FrameNode[]) {
    let node;
    while (nodes.length) {
        node = nodes.shift();
        // do your thing and then call delayAsync
        // this will prevent Figma from freezing
        await delayAsync(10);
    }
    return something;
}
Terms & ConditionsCookie settings

Cookie policy

We use cookies to enhance and personalize your experience. If you accept you agree to our full cookie policy. Learn more about our cookies.

 
Cookie settings