How to split plugin's "work" into chunks?

Splitting the work into chunks means you need to pause the process every 100 items for example: make a pause in the processing so that UI could update, then continue. Technically I do it by putting the processing into an async function that gets paused every X items processed. I use a simple delay function and pause the work every so often.

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

async function processChunks() {
  for (let i = 0; i < 10000; i++) {
    figma.createFrame() // do something
    if (i %  100 === 0) {
      await delay(40) // pause for 40ms every 100 items
      // usually this is enough for UI to update
    }
  }
}

processChunks()
2 Likes