english | русский


SVGO NPM version Build Status Coverage Status

SVG Optimizer – это инструмент для оптимизации векторной графики в формате SVG, написанный на Node.js.

Зачем?

SVG-файлы, особенно экспортированные из редакторов, содержат много избыточной и бесполезной информации, комментариев, скрытых элементов, неоптимальные или стандартные значения и другой мусор, удаление которого безопасно и не влияет на конечный вид изображения.

Возможности

SVGO имеет расширяемую архитектуру, в которой почти каждая оптимизация является отдельным расширением.

Что у нас есть:

PluginDescription
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
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
  • с файлами:

    $ svgo test.svg
    

    или:

    $ svgo *.svg
    
    $ svgo test.svg -o test.min.svg
    
    $ svgo test.svg other.svg third.svg
    
    $ svgo test.svg other.svg third.svg -o test.min.svg -o other.min.svg -o third.min.svg
    
  • со STDIN / STDOUT:

    $ cat test.svg | svgo -i - -o - > test.min.svg
    
  • с папками

    $ svgo -f ../path/to/folder/with/svg/files
    

    или:

    $ svgo -f ../path/to/folder/with/svg/files -o ../path/to/folder/with/svg/output
    
    $ svgo *.svg -o ../path/to/folder/with/svg/output
    
  • со строками:

    $ svgo -s '<svg version="1.1">test</svg>' -o test.min.svg
    

    или даже с Data URI base64:

    $ svgo -s 'data:image/svg+xml;base64,…' -o test.min.svg
    
  • с SVGZ:

    из .svgz в .svg:

    $ gunzip -c test.svgz | svgo -i - -o test.min.svg
    

    из .svg в .svgz:

    $ svgo test.svg -o - | gzip -cfq9 > test.svgz
    

Другие способы использования SVGO

Лицензия и копирайты

Данное программное обеспечение выпускается под лицензией MIT.

Логотип – Егор Большаков.