Практики оптимизации SVG при рисовании в Illustrator

Question

пользователь 289877

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

Нашел этот интересный инструмент оптимизатора SVG:

Я также обнаружил, что следующие приемы могут повысить производительность вашей финальной анимации:

Использование предопределенных фигур в SVG, таких как круги, эллипсы, квадраты, прямоугольники и многоугольники, вместо контуров.
Уменьшение количества кривых и углов при использовании контуров.
При экспорте AI в SVG выберите параметр «атрибуты представления», чтобы стили находились внутри тега SVG, а не связывались с внешним файлом CSS.

Мой вопрос сейчас:

Какие еще аспекты необходимо учитывать ПРИ РАБОТЕ В ILLUSTRATOR, чтобы улучшить конечную производительность SVG-анимации?

Спасибо.

Я не знаю, работает ли он с анимированными SVG, но SVGOMG отлично подходит для оптимизации SVG.

Предопределенная вещь не очень хорошо работает при работе в иллюстраторе.

Я не знаю, работает ли он с анимированными SVG, но SVGOMG отлично подходит для оптимизации SVG.
Предопределенная вещь не очень хорошо работает при работе в иллюстраторе.

КрасивыйФил · Answer 1

Вот несколько простых вещей, которые вы можете сделать в Illustrator, чтобы уменьшить размер файла:

Слияние как можно большего количества фигур вместе.
Расширение путей, если вы должны использовать путь вместо формы.
Уменьшение десятичных разрядов до 1. Это можно найти в дополнительных параметрах Illustrator при сохранении изображения в формате SVG.
Не сохраняйте возможности редактирования AI.
Избегайте любых эффектов Illustrator или Photoshop.

Аманда · Answer 2

Я поддерживаю все в ответе HandsomePhil и добавлю:

Разгруппируйте элементы, если вам не нужно ссылаться на группы при работе с SVG. Это избавит от лишних <g>тегов.
Ограничьте количество цветов.
Подгоните монтажную область к границам обложки («Объект» > «Монтажные области» > «Подогнать к границам обложки» в CS5).