iconify/tools

Minify arcs

Closed this issue · 5 comments

KTibow commented

This might be out of scope but Many icons have duplicate arcs. Look at this path:

M12 19.2c-2.5 0-4.71-1.28-6-3.2.03-2 4-3.1 6-3.1s5.97 1.1 6 3.1a7.232 7.232 0 01-6 3.2M12 5a3 3 0 013 3 3 3 0 01-3 3 3 3 0 01-3-3 3 3 0 013-3m0-3A10 10 0 002 12a10 10 0 0010 10 10 10 0 0010-10c0-5.53-4.5-10-10-10Z

In theory, automatic optimizations could convert it to:

M12 19.2c-2.5 0-4.71-1.28-6-3.2.03-2 4-3.1 6-3.1s5.97 1.1 6 3.1a7.232 7.232 0 01-6 3.2M12 5a3 3 0 010 6 3 3 0 010-6m0-3a10 10 0 000 20 10 10 0 0010-10c0-5.53-4.5-10-10-10Z

Or maybe

M12 19.2c-2.5 0-4.71-1.28-6-3.2.03-2 4-3.1 6-3.1s5.97 1.1 6 3.1a7.232 7.232 0 01-6 3.2M12 5a3 3 0 010 6 3 3 0 010-6m0-3A10 10 0 1022 12c0-5.53-4.5-10-10-10Z

Or even

M12 19.2c-2.5 0-4.71-1.28-6-3.2.03-2 4-3.1 6-3.1s5.97 1.1 6 3.1a7.232 7.232 0 01-6 3.2M12 5a3 3 0 010 6 3 3 0 010-6m0-3a10 10 0 1010 10 10 10 0 00-10-10Z

If this was somehow implemented, it would make Iconify even smaller.

cyberalien commented

Same as with other issue: no plans to do that. It is not in scope of this project, as such optimisations are done by SVGO.

This could be a good idea for SVGO plugin though.

If you'll create SVGO plugin that does that, it would be amazing. One thing to consider (common bug in various SVGO plugins): do not apply it to paths that are being animated.

KTibow commented

I made a plugin that switches to z and joins arcs. Now I have two questions:

  • is there an Iconify discord or somewhere that's more convenient to chat in?
  • how do I set up the library into a dev environment?
KTibow commented

Now I have a 3rd oddity. When I use iconify tools with mdi and the example script from the README, I get icons that are more minified than @iconify-icons/mdi.

cyberalien commented
  • is there an Iconify discord or somewhere that's more convenient to chat in?

Sure. See https://iconify.design/support/

  • how do I set up the library into a dev environment?

It is a monorepo that uses pnpm, so run pnpm install.

If you want to access only tools, change directory to @iconify/tools and work only with tools package. pnpm run build to build, pnpm run test to test.

Now I have a 3rd oddity. When I use iconify tools with mdi and the example script from the README, I get icons that are more minified than @iconify-icons/mdi.

That's because icons are de-optimised using deOptimisePaths(). Unfortunately some software (mostly for design) still use outdated libraries for SVG, which cannot handle some optimisations in path. I'd rather have few extra bytes in icons than icons not working for some users.

KTibow commented

pnpm run test to test

The tests seem to be broken because it can't resolve the files

 FAIL  tests/misc/version-test.ts
  ● Test suite failed to run

    tests/misc/version-test.ts:1:29 - error TS2307: Cannot find module '../../lib/misc/bump-version' or its corresponding type declarations.

    1 import { bumpVersion } from '../../lib/misc/bump-version';

edit: it just occured that i may need to build before testing