Feature request: Count layers being loaded into memory

[chrisaustin1618]

It would be helpful to see how many layers are being loaded into memory in addition to what's physically represented when a component instance is brought into a file from a library. I currently use the resource use tool to help with that, but it calculates everything in the file, so I'm constantly having to create random files to isolate a component and/or write down layer counts before I bring in an instance.

I tried running it directly in my library by selecting all of the variants, and that definitely gave me a good ballpark. But many of my components have other nested components which are loading layers into memory as well. It would be great to see what that total number is.

This is a fantastic plugin; thank you for the work you've done on it!

[Ligerx]

Hmmm interesting use case. My first reaction is that this would be better served with a separate plugin specifically to measure memory usage. It sounds like you want to see variant memory footprint, but are looking at layer count as a proxy.

[chrisaustin1618]

I did check to see if there were any plugins that did what you mentioned and came up dry. You are correct in what I'm trying to do. Like I mentioned in my original post, the resource use option helps, but at a very broad level. What I was hoping this plugin could also do was give me insight into how the total number of layers represented by an instance is impacting the memory. That would allow me to make some better informed decisions on how to refactor components to make our libraries more efficient. And having it as an option or section in your plugin would allow me to keep one plugin open for that kind of work instead of having to jump around to multiple plugins. But I totally understand if it's a bit of a fringe case or outside of scope. It just takes a fair amount of work to get that kind of insight.

[Ligerx]

https://www.figma.com/plugin-docs/api/InstanceNode/#maincomponent https://www.figma.com/plugin-docs/api/properties/nodes-parent/

Components accessed via instance.mainComponent do not always have a parent. They could be remote components or soft-deleted components.

This implies that you can't reliably get information about variants. Are you asking about variants or the old way of using hidden components nested within a main component?

[chrisaustin1618]

Here's my use case:

I have a button component with the following elements:

• Label
• Icon (component)
• Progress indicator to show pending states (component)

Icon and progress are also components nested within the button. If I run the plugin against a button variant with both icon and progress indicator present, I see a total of 11 layers. Expanding the layers of that variant shows that there are in fact 11 physically-represented layers (5 with icon, 3 with progress, and 3 with that button variant itself) directly accessible within that variant and its nested layers, so that makes sense (as a side note, there are 4,752 total layers for the entire button component).

But within the icon instance there are actually about 25 initially loaded into memory.

Within progress, it's about 81.

To get those numbers, I had to note all of the nested components within button, go to their pages in Figma, count their layers, and then add everything up so I have a more accurate count of the layers that are getting loaded into memory with a given component. The other option is open a blank file, turn on the resource use display, add a component instance and note the different in the layer count. If I want to check a different component, I either have to write down/remember the first number and subtract it from the updated layer count when I bring it in, or delete everything from my test file, reload the page to clear the memory, and start the process over.

My hope was for there to be another line or option in your plugin that notes the total number of layers as represented in memory with the selection in addition to what's physically represented. So with my button example, I would see the following layer counts being loaded into memory (not necessarily listed out by component—represented that way so you can see the math):

• Button: 4,752
• Icon: 25
• Progress: 81
• TOTAL: 4,858

That's noticeably different from the 11 physical layers represented in my first example.

That gives me a more accurate idea of the impact a given component has when it's added to a file.

[Ligerx]

So I'm not super confident that figma will expose the ability to get that information, but I'd need to experiment to confirm. However, my personal acct doesn't have the ability to publish libraries to test this. I can maybe test at work?

[chrisaustin1618]

No worries at all! I appreciate the willingness to look into it. The plugin is amazing as it is and is now part of my daily arsenal. This would just be the icing on the cake that would solve a long-standing and somewhat related challenge.

If you're able to dig further, please keep me posted. Otherwise, if it doesn't work out for whatever reason, I really appreciate your time talking it through with me.

[Ligerx]

@chrisaustin1618 looks like I should be able to get variants. But what's the expected behavior when there's multiple of the same component?

For example, if you have two instances of the same button variant component, I'm guessing it's referring to the same data in memory, so you would only count the variants' layers once.

[Ligerx]

I just published an update with how I'm understanding you'd count variants. Please let me know if that addresses your needs @chrisaustin1618.

note: I had to refresh my open figma file for the plugin update

[chrisaustin1618]

This is great! Thank you for all of your work on this.