Yes, Figma needs some fine tuning…

One Thing That is surely Work is steps i mention below will work for you maybe.

First thing you should more Focus is that i used figma in Chrome browser then i switched to it’s official app. It Great Works on desktop. Also Chrome browser use lots memory to run.

Second thing is If you are using Rulers in making Wireframes, Then it will definitely slow down process by half. I know Rulers are very important in Pixel Perfect Design, but when you need them most then you can use it, otherwise turn it off.

Third thing, if your design have lots of Images then use it by compressing via Plugin “Downside”.

My prototype starts lagging when i start a screenshare on zoom. It works fine for the first few mins but then the zoom cpu graph maxes out and the lag kicks in. I tried reinstalling zoom but it didn’t work. If i am not on zoom and dont screenshare, the prototype works from ne. This started happening a few days back and i am really frustrated as i have an important demo coming up in a few days. If anyone can help, please let me know. Thanks

I hope Figma is tracking FPS on user’s machines so they can identify the use-cases where performance is laggy. I’d happily let Figma spy on my projects if it meant they were gonna improve performance.

Also struggling with performance here, especially since my project is for a data entry system containing many interactive tables and busy displays.

Question - I’m trying to make it load faster and run smoother and have done ALL of the recommended optimisations already, but wondered which way to go on the following:

• Local components vs Separate file for design system - Does it make a difference on file size or performance? Should I link my file to our design system and use their components, or detach it and keep only the ones I use in the local file?


• More screens vs using variables - Using Figma variables does seem to have a significant impact on performance, however when compared to having hundreds of screens in replace, I’m not sure which is better. e.g. 1 screen where variables control a combination of instances on that screen, or multiple screens to contain each possible combination of instances?


• Additional layers vs additional elements - I use lots of auto-layouts and layers to make my tables easy to maintain and interactive/responsive. I could reduce the number of layers if I add additional ‘spacer’ squares, e.g. instead of a header and table content having separate frames each with separate auto-layouts, I could combine them into one auto-layout with 0px spacing and just use blank squares to create the spacing where needed - would this be better for performance, i.e. each extra layer/level = 10 extra blank elements?


• Many component variants vs few variants with more hidden layers - Should I have, say, 1 table cell as a component, which contains many hidden elements which I can just toggle visible on the cells that need it, or create many variants of the table cell so that each time I use it I use the specific variant that I need which contains exactly what is needed? (The boolean component property is meant to be efficient for this, but it doesn’t work with variables so I’ve avoided it so far in favour of point 2 above)


• Modify a component instance vs detach the component - Is it better to keep as many things attached to components as possible, or if I end up making small overrides to the local instance is it better to detach it?

Any experience or knowledge of any of the above points would be really useful!

Local components: they are always loaded so they take up resources. External components are only loaded when you use an instance of them so if you use a library with 100 components and use only one component, only that one component will be loaded.

Fewer nodes = better. Doesn’t matter which type of nodes they are.

Few variants with hidden layers would be better since all variants are loaded at once when you use a single variant so if you have 20 buttons with 5 layers each, that’s 100 layers to load but if you have one button with 10 hidden layers that’s only 10 layers to load.

Shouldn’t matter for performance. But if you delete layers after detaching, that would be an improvement, e.g. if you have a complex instance with 100 nodes but only need 5 of them (others are hidden), then it might be better to detach. Detaching is not favorable though when you use components if it’s a long-term project which you are planning to maintain and update.

That’s amazing - thank you!

Also very glad to hear that I can create/use an external component library without it overloading every file that I link it to!

Would still be very interested to hear what effect variables and their various uses have on performance.