I have been extensively using penpot for the last few days and I am enjoying it especially the new flex layout. Currently, I am building a series of designs - with some components. It has less than 30 components (mostly groups / using the flex layout). There are 2 pages (one with the design system components) and the other with the designs. This design page around 12 boards with each board having ~70-100 layers (a rough estimate). This means the whole page has around 800-1200 layers. I am noticing significant performance drop and also crashes frequently. Tried with both Edge and Chrome (on the latest version) on Windows 10. It is extremely slow and laggy with the app being unusable at times. Many a times a simple undo of text layer don’t work and also aligning between objects takes about half a minute or more.
While I understand that it is a web app at the end of the day running on a browser and they have limitations for varied technical and security reasons, what are things that can help me mitigate this. I can split the design page into multiple pages and keep 2 or 3 boards in a page. Will that help in improving the performance?
Apart from this, I would like to understand the factors which impacts the performance. Plus some tips and tricks you will suggest to improve the performance especially while working on large projects
I’m not even working on a large project and I’m finding my performance dropping to unusable levels as well. I’m using several levels of boards within boards in exploring the new flex layout feature which may be a contributing factor.
Not sure if it would help but you can increase the available browser memory for either Chrome or Firefox pretty easily, by default Chrome browser memory is only 1.4GB I believe.
@crenfrow My file is also having nested flex boards and maybe they are slowing down. If i look at the total nested boards, they may be 80 or so (Mostly the same components reused across the 12 boards)
@michaelsynan The downloaded file size is less than 15MB. So, I am not sure if this will help but still I’ll give it a try. Thanks for your suggestion
Thank you for the suggestion! However it doesn’t seem to be related to memory consumption. When I queue up a few actions I can see one CPU core max out and then nothing happens. Firefox’s
about:performance shows massive spikes in dispatches when this happens.
Here’s a screenshot of my project composition.
This seems pretty conservative by the standards put forth in this thread so I’m not sure what my issue could be.
My preferred browser is Firefox, however @crenfrow after months of fight with poor performance I had to switch to chrome … until firefox is fixed (by Penpot or mozilla).
I use the ungoogled chromium, GitHub - ungoogled-software/ungoogled-chromium: Google Chromium, sans integration with Google and the mac binaries, GitHub - ungoogled-software/ungoogled-chromium-macos: macOS packaging for ungoogled-chromium
Once I did this usability shoot up by 75% (I didn’t measure this, just a estimation). It’s not like using a native app and I can’t remember how figma was in the setup, but it’s so much better now.
Perhaps this will help you. Also Since I only use chrome for penpot, I only have that tab open nothing else. In firefox I had a lot of tabs open for other task which I think contributed to the slow downs as well. Good luck.
This was the first thing I tried and I noticed similar performance drops. But thank you for the suggestion, perhaps it will help someone else.
I’m beginning to think it’s an environment issue for me.
I see too bad it’s wasn’t a easy solution like I mentioned. Have you tried figma on the same setup (ie, same layers, object, etc)?
I haven’t used Figma before but I suppose it’s worth trying to see if the issue persists there.
Yeah it’s very similar, I’m no expert with it. But if I was in your place I would use it as a way to isolate the issues. Especially since you mentioned that switching browser made no to little difference.
Yes I’m also proceeding this way now.
I’m encountering too many bugs and crashes using firefox : for example most of the time the objects don’t snap properly or it takes a few seconds to detect edges. Also I can’t click on an object to select it, I have to click below it (or select it in the left menu and right-click - edit).
Firefox is my to-go browser but I started to use chromium for penpot since I couldn’t find a way out.
Maybe this was connected to the Firefox issue.
I’m working in a Linux environment so that wouldn’t be for this reason. I’m thinking of updating my laptop (for several reasons), that might help to fix this issue.
There are some best practices that might help you improve performance:
- Chrome is the faster and most efficient browser when working with Penpot. If you are using another browser, consider switching to Chrome;
- File size and layer amount affect the performance, consider dividing your work in more files and more pages for better performance.
I hope these are helpful
I’m using chromium and it is much faster than in Firefox I confirm !