DEV Community

Cover image for Optimizing Excalidraw: Simple File Size Reduction Tactics
Omar Hussein
Omar Hussein

Posted on

Optimizing Excalidraw: Simple File Size Reduction Tactics

Excalidraw is a versatile and user-friendly platform for creating diagrams, sketches, and collaborative drawings. As with any software, users and developers are constantly looking for ways to enhance its performance and efficiency. In this post, I'll explore my recent contribution to Excalidraw that addresses a crucial issue and significantly improves the file size of drawings.

The Issue:

Excalidraw users may have encountered a common concern regarding the size of save files, libraries, and the clipboard. Issue #7169 on the Excalidraw GitHub repository highlights the problem, pointing out that even small drawings could result in file sizes as large as 612K. The issue context notes that, upon inspecting the .excalidraw file with a text editor, the JSON structure is "prettified," contributing to the larger file sizes. The user suggests that minifying the .excalidraw files could save substantial space without sacrificing usability.

The Contribution:

The proposed solution comes in the form of a modification to the JSON.stringify function, ensuring that the output to the file does not include unnecessary spacing, essentially minifying the JSON. This change results in a notable reduction in file size for save files, libraries, and when copying to the clipboard.

To put this improvement into perspective, a simple test file exhibited a reduction from 31.4kb to 17.1kb. User reports indicate that the reduction becomes even more significant as drawings increase in complexity. For instance, the original issue mentioned a file size reduction from 612K to 296K when using the jq -r tostring command to minify the .excalidraw file. Notably, the minified file still opens seamlessly in the browser.

Reasons to Merge:

The pull request containing this modification presents compelling reasons to merge the changes into the Excalidraw codebase:

Reduces Size on Local/Cloud Storage:

Minifying the .excalidraw files leads to a substantial reduction in file size, addressing the concern of large storage requirements. This optimization not only benefits individual users but also contributes to more efficient cloud storage solutions.

Faster Saving on Slow Connections:

The reduced file size directly translates to faster saving, especially for users with slower internet connections. This improvement enhances the overall user experience by minimizing the time required to save and load drawings.

Conclusion:

Excalidraw continues to evolve, thanks to the active contributions of its community. The recent pull request to minimize the size of .excalidraw files is a example of how user feedback and developer expertise come together to enhance the platform's performance. By addressing the issue of inflated file sizes, Excalidraw becomes an even more efficient and user-friendly tool, catering to the diverse needs of its growing user base.

Top comments (0)