Skip to main content

I have a plugin that, at startup, iterates over the children of a ComponentSetNode. For each ComponentNode, it extracts some data from four descendants of the ComponentNode. Recently users complained that startup was taking a long time. So I’ve been looking into it.


The code uses findAllWithCriteria to find three text nodes, and findOne to locate an InstanceNode. I discovered that processing each ComponentNode is taking around 180 ms.


I had the bright idea that it might be more efficient to avoid finding the descendent nodes and pick them out directly. The ComponentNode structure is fixed, so I ended up with four statements in the general form of:


const nameNode: TextNode = item.childrene0].childrene0].childrene1].childrene0]

This is of course more fragile, but I was hoping to see an improvement in processing time. Instead, it nearly doubled to 318 ms average.


So, yay for Figma code being more efficient, but I guess I’m looking for some thoughts on why this is so slow to begin with. I can’t prove it, but to my best recollection this started just a few months ago. I don’t believe this used to be slow. The code that handles this has been stable for a long time, and we haven’t had a big increase in the number of ComponentNodes that we’re processing.


For now I’m working around it by using setTimeout to handle one ComponentNode at a time. This alleviates the issue of having the UI freeze while we load this data, but this makes getting the data take even longer. So not a really happy solution.

Hi, do you have figma.skipInvisibleInstanceChildren = true in your plugin (docs)?


If any of your components have nested instances that have invisible sublayers, then the above line will make traversing the component subtree much faster.


As for the plugin getting slower, it’s possible with more complicated components and nested instances with invisible sublayers that finding the nodes you’re interested in has worse performance characteristics even if your code is unchanged.


If you’re still having performance issues after trying the above, I’d recommend filing a support ticket with a file containing a copy of the component in question, and we can help debug further.


Just wanna add that this will be slow because accessing children of a node is slow (and the time is proportional to the number of children).

Reply


Terms & ConditionsCookie settings