english | русский
SVG Optimizer – это инструмент для оптимизации векторной графики в формате SVG, написанный на Node.js.
SVG-файлы, особенно экспортированные из редакторов, содержат много избыточной и бесполезной информации, комментариев, скрытых элементов, неоптимальные или стандартные значения и другой мусор, удаление которого безопасно и не влияет на конечный вид изображения.
SVGO имеет расширяемую архитектуру, в которой почти каждая оптимизация является отдельным расширением.
Что у нас есть:
| Plugin | Description |
| ------ | ----------- |
| cleanupAttrs | удаление переносов строк и лишних пробелов |
| inlineStyles | перенос стилей из элементов <style>
в атрибуты style
|
| removeDoctype | удаление doctype |
| removeXMLProcInst | удаление XML-инструкций |
| removeComments | удаление комментариев |
| removeMetadata | удаление <metadata>
|
| removeTitle | удаление <title>
|
| removeDesc | удаление <desc>
|
| removeUselessDefs | удаление элементов в <defs>
без id
|
| removeXMLNS | удаление атрибута xmlns (для заинлайненных svg, выключено по умолчанию) |
| removeEditorsNSData | удаление пространств имён различных редакторов, их элементов и атрибутов |
| removeEmptyAttrs | удаление пустых атрибутов |
| removeHiddenElems | удаление скрытых элементов |
| removeEmptyText | удаление пустых текстовых элементов |
| removeEmptyContainers | удаление пустых элементов-контейнеров |
| removeViewBox | удаление атрибута viewBox
, когда это возможно |
| cleanupEnableBackground | удаление или оптимизация атрибута enable-background
, когда это возможно |
| minifyStyles | уменьшает содержимое элементов <style>
с помощью CSSO. |
| convertStyleToAttrs | конвертирование стилей в атрибуте style
в отдельные svg-атрибуты |
| convertColors | конвертирование цветовых значений: из rgb()
в #rrggbb
, из #rrggbb
в #rgb
|
| convertPathData | конвертирование данных Path в относительные или абсолютные координаты, смотря что |короче; конвертирование одних типов сегментов в другие; удаление ненужных разделителей; умное округление и тому подобное
| convertTransform | схлопывание нескольких трансформаций в одну, конвертирование матриц в короткие алиасы |и многое другое
| removeUnknownsAndDefaults | удаление неизвестных элементов, контента и атрибутов |
| removeNonInheritableGroupAttrs | удаление ненаследуемых "презентационных" атрибутов групп |
| removeUselessStrokeAndFill | удаление неиспользуемых атрибутов stroke- и fill- |
| removeUnusedNS | удаление деклараций неиспользуемых пространств имён |
| prefixIds | добавляет префикс в ID или классы в виде имени файла или произвольной строки |
| cleanupIDs | удаление неиспользуемых и сокращение используемых ID |
| cleanupNumericValues | округление дробных чисел до заданной точности, удаление px
как единицы |измерения по-умолчанию
| cleanupListOfValues | округление числовых значений в атрибутах со списком чисел, таких как viewBox
|или enableBackground
| moveElemsAttrsToGroup | перемещение совпадающих атрибутов у всех элементов внутри группы <g>
|
| moveGroupAttrsToElems | перемещение некоторых атрибутов группы на элементы внутри |
| collapseGroups | схлопывание бесполезных групп <g>
|
| removeRasterImages | удаление растровых изображений (выключено по умолчанию) |
| mergePaths | склеивание нескольких Path в одну кривую |
| convertShapeToPath | конвертирование простых форм в Path |
| sortAttrs | сортировка атрибутов элементов для удобочитаемости (выключено по умолчанию) |
| removeDimensions | удаляет атрибуты width/height при наличии viewBox (противоречит removeViewBox — плагин должен быть выключен) (выключено по умолчанию) |
| removeAttrs | удаляет атрибуты по указанному паттерну (выключено по умолчанию) |
| removeAttributesBySelector | удаляет атрибуты по CSS-селектору (выключено по умолчанию) |
| removeElementsByAttr | удаляет элементы по указанным ID или классам (выключено по умолчанию) |
| addClassesToSVGElement | добавляет имена классов корневому элементу <svg>
(выключено по умолчанию) |
| addAttributesToSVGElement | добавляет атрибуты корневому элементу <svg>
(выключено |по умолчанию)
| removeOffCanvasPaths | удаляет элементы вне отрисовываемой области (выключено по умолчанию) |
| removeStyleElement | удаляет элементы <style>
(выключено по умолчанию) |
| removeScriptElement | удаляет элементы <script>
(выключено по умолчанию) |
| reusePaths | Заменяет дублирующиеся элементы ссылками (выключено по умолчанию) |
Хотите узнать принципы работы и как написать свой плагин? Конечно же, да!
$ [sudo] npm install -g svgo
Запуск:
svgo [OPTIONS] [ARGS]
Параметры:
-h, --help : Помощь
-v, --version : Версия программы
-i INPUT, --input=INPUT : Входной файл, "-" для STDIN
-s STRING, --string=STRING : Входная строка SVG
-f FOLDER, --folder=FOLDER : Входная папка, оптимизирует и перезаписывает все файлы *.svg
-o OUTPUT, --output=OUTPUT : Выходной файл или папка (совпадает с входным по умолчанию), "-" для STDOUT
-p PRECISION, --precision=PRECISION : Число цифр после запятой, переопределяет параметры плагинов
--config=CONFIG : Файл конфигурации (или строка JSON) для расширения и замены настроек
--disable=PLUGIN : Выключение плагина по имени, "--disable=PLUGIN1,PLUGIN2" для отключения нескольких плагинов
--enable=PLUGIN : Включение плагина по имени, "--enable=PLUGIN3,PLUGIN4" для отключения нескольких плагинов
--datauri=DATAURI : Результат в виде строки Data URI (base64, URI encoded или unencoded)
--multipass : Оптимизация в несколько проходов
--pretty : Удобочитаемое форматирование SVG
--indent=INDENT : Размер отступа для удобочитаемого форматирования
-r, --recursive : Совместно с '-f'. Рекурсивно обрабатывать *.svg файлы в папках.
-q, --quiet : Подавляет вывод информации, выводятся только сообщения об ошибках
--show-plugins : Доступные плагины
Аргументы:
INPUT : Аналогично --input
с файлами:
sh
$ svgo test.svg
или:
sh
$ svgo *.svg
sh
$ svgo test.svg -o test.min.svg
sh
$ svgo test.svg other.svg third.svg
sh
$ svgo test.svg other.svg third.svg -o test.min.svg -o other.min.svg -o third.min.svg
со STDIN / STDOUT:
sh
$ cat test.svg | svgo -i - -o - > test.min.svg
с папками
sh
$ svgo -f ../path/to/folder/with/svg/files
или:
sh
$ svgo -f ../path/to/folder/with/svg/files -o ../path/to/folder/with/svg/output
sh
$ svgo *.svg -o ../path/to/folder/with/svg/output
со строками:
sh
$ svgo -s '<svg version="1.1">test</svg>' -o test.min.svg
или даже с Data URI base64:
sh
$ svgo -s 'data:image/svg+xml;base64,…' -o test.min.svg
с SVGZ:
из .svgz
в .svg
:
sh
$ gunzip -c test.svgz | svgo -i - -o test.min.svg
из .svg
в .svgz
:
sh
$ svgo test.svg -o - | gzip -cfq9 > test.svgz
Данное программное обеспечение выпускается под лицензией MIT.
Логотип – Егор Большаков.
Add the following code to your website.
For more information on customizing the embed code, read Embedding Snippets.