Оптимизация / сжатие SVG-изображений

Здарствуй Хабр!
Статья посвящена оптимизации изображений формата SVG.

SVG ^[1] (от англ. Scalable Vector Graphics — масштабируемая векторная графика) — язык разметки масштабируемой векторной графики, созданный Консорциумом Всемирной паутины (W3C) и входящий в подмножество расширяемого языка разметки XML, предназначен для описания двумерной векторной и смешанной векторно/растровой графики в формате XML.

Инструменты

Принцип работы приложений заключается в следующем, они удаляют «ненужную» информацию из SVG, тем самым уменьшается размер самого файла. На сегодняшний день можно выделить три основных приложения для оптимизации SVG:

• SVG Cleaner ^[2];
• SVG Scour ^[3] (для работы необходимо установить Python ^[4]);
• SVG Optimizer ^[5] (для работы необходимо установить Node.js ^[6]).

Сравнение

Для сравнения результатов приложений, я взял следующее изображение ^[7].

Изображение

Изображение сохранено с помощью Adobe Illustrator CS6.

Параметры SVG

Размер изображения — 6 279 219 байт

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

Заключение

1. Последовательное использование приложений помогает увеличить степь сжатия изображения.
2. SVG представляет собой текстовой файл XML, программы по оптимизации могут «испортить» изображения, т.е. браузеры не правильно отрисовывают изображение.
3. SVG поддерживает не только векторную графику, но растровую, но современные приложения по оптимизации SVG не поддерживают оптимизацию растровых изображений.

Автор: Lorents

Источник ^[8]