Ran lossless optimization on assets for template #518
Conversation
There was a problem hiding this comment.
I'm sure you've researched the tool enough so we can be sure there isn't any quality downgrade.
I see some mention of ultra HDR being filtered out, but I don't think we have such use case. Make sure you are 100% safe with running this.
https://www.reddit.com/r/macapps/comments/1exkgs3/comment/mao7tz4
Down the line we will probably want .webp. (Google loves it, good for SEO)
Just check how prettier interacts with the one svg file we have.
| <path d="M13.7812 9.65625H9.65625C9.28125 9.65625 8.9375 9.96875 8.9375 10.375C8.9375 10.75 9.25 11.0937 9.65625 11.0937H13.7812C14.1562 11.0937 14.5 10.7813 14.5 10.375C14.4687 9.96875 14.1562 9.65625 13.7812 9.65625Z" fill="#FFFFFF"/> | ||
| <path d="M13.0625 16.25C12.6875 16.25 12.3438 16.5625 12.3438 16.9687V17.8125C12.3438 17.9375 12.2188 18.0625 12.0938 18.0625H3.625C3.5 18.0625 3.375 17.9375 3.375 17.8125V6.375C3.375 6.25 3.5 6.125 3.625 6.125H4.6875C5.0625 6.125 5.40625 5.8125 5.40625 5.40625C5.40625 5 5.09375 4.6875 4.6875 4.6875H3.625C2.71875 4.6875 1.96875 5.4375 1.96875 6.34375V17.8125C1.96875 18.7188 2.71875 19.4687 3.625 19.4687H12.125C13.0313 19.4687 13.7812 18.7188 13.7812 17.8125V16.9687C13.7812 16.5625 13.4687 16.25 13.0625 16.25Z" fill="#FFFFFF"/> | ||
| </svg> | ||
| <svg fill="none" height="20" viewBox="0 0 20 20" width="20" xmlns="http://www.w3.org/2000/svg"><g fill="#fff"><path d="m17.6875 4.125-3.2813-3.25c-.2187-.21875-.5312-.34375-.8437-.34375h-5.6875c-.90625 0-1.65625.75-1.65625 1.65625v11.4062c0 .9063.75 1.6563 1.65625 1.6563h8.5c.9062 0 1.6562-.75 1.6562-1.6563v-8.62495c0-.3125-.125-.625-.3437-.84375zm-3.2188-1.1875 1.1875 1.1875h-1.1875zm1.9063 10.9062h-8.5c-.125 0-.25-.125-.25-.25v-11.4062c0-.125.125-.25.25-.25h5.1875v2.875c0 .375.3125.71875.7187.71875h2.8438v8.09375c0 .125-.125.2187-.25.2187z"/><path d="m13.7812 7.03125h-4.12495c-.375 0-.71875.3125-.71875.71875s.3125.71875.71875.71875h4.12495c.375 0 .7188-.3125.7188-.71875s-.3438-.71875-.7188-.71875z"/><path d="m13.7812 9.65625h-4.12495c-.375 0-.71875.3125-.71875.71875 0 .375.3125.7187.71875.7187h4.12495c.375 0 .7188-.3124.7188-.7187-.0313-.40625-.3438-.71875-.7188-.71875z"/><path d="m13.0625 16.25c-.375 0-.7187.3125-.7187.7187v.8438c0 .125-.125.25-.25.25h-8.4688c-.125 0-.25-.125-.25-.25v-11.4375c0-.125.125-.25.25-.25h1.0625c.375 0 .71875-.3125.71875-.71875s-.3125-.71875-.71875-.71875h-1.0625c-.90625 0-1.65625.75-1.65625 1.65625v11.46875c0 .9063.75 1.6562 1.65625 1.6562h8.5c.9063 0 1.6562-.7499 1.6562-1.6562v-.8438c0-.4062-.3125-.7187-.7187-.7187z"/></g></svg> No newline at end of file |
There was a problem hiding this comment.
I'm not sure if prettier formats .svg files.
But here we are missing EOL. Should we miss it on .svg files? Try running prettier in root.
We still don't have format check workflow here.
There was a problem hiding this comment.
Prettier does not run on .svg files without plugins; and here the EOL is missing on purpose. Even though .svgs are textual content, they are not used as source code here, but as regular assets; that's why they are neither formatted nor have an EOL, as they are optimized for size.
There was a problem hiding this comment.
Also, checked if any images have HDR and they don't seem to.
templatesize #516Just a quick win. Ran ImageOptim on all the
templateimages. I used lossless settings, which means the output is pixel-for-pixel equal but the binary data was re-encoded/re-compressed, favoring the smallest possible output size.TL;DR: 28% size reduction overall, and the files look the same.