Итак, есть такой популярный оптимизатор svg - SVGO. В последние годы у мейнтейнеров не было достаточно времени чтобы возиться с ним. И это понятно, инструмент большой и сложный, легко выгореть.
github.com/svg/svgo
Конечно, первым делом я смерджил свои пул реквесты, чтобы избавиться от всякой гадости в node_modules.
Затем решил очень старую проблему, которую помню еще со времен работой над cssnano. SVGO асинхронный. Это мешает запускать cssnano в синхронном режиме, например, внутри babel или node хуках.
Ну и раз уж мы делаем breaking changes, надо поправить фасад. SVGO класс превратился в optimize функцию. Упростил жуткие конфиги плагинов, которые подгоняли под yaml. Да и вообще выпилил yaml - уж больно жирный.
Изначально пакет писался для ноды. Инструменты вроде svgomg запускают svgo в браузере. Специально для них добавил esm бандл
jakearchibald.github.io/svgomg/
Баги я решил не трогать до релиза. Важно было решить крупные проблемы и немного познакомиться с кодом. Поэтому 2.0 был готов уже через 4 дня.
В вебстандартах звучала мысль, что новые мейнтейнеры могут перевернуть все с ног на голову и в какой-то степени испортить проект. SVGO не движется слепо одним безумцем. Мы с @deepsweet обсуждаем все крупные изменения.
Добавляйтесь в наш дискорд сервер, если хотите участвовать в обсуждениях.
discord.gg/z8jX8NYxrE
С новым мейнтейнером хорошо бы и логотип освежить. В этом нам помог André Castillo из Мексики.
Вот она, сила коммьюнити.
Итак, время баг фиксов. В первую очередь быстро закрыл собственные косячки, затем приступил к старым багам. Несколько ребят помогли проверить и закрыть кучу ишьюсов.
В ишьюсах кинули, что svgcleaner запускает visual regressions тесты и выставляет svgo не в лучшем свете.
github.com/RazrFalcon/svg…
Вызов принят!
Спасибо playwright и pixelmatch, теперь мы запускаем 435 из 526 кейсов w3c svg test suite. Скоро добавим много другиих кейсов.
Пришло время взрослого кодинга
Регрессии поймали пару проблем с path data. Раньше svgo парсил с помощью регулярок. Закопался на сутки в спеках и запилил новенький и легонький парсер и стрингифайер Давненько я парсеров не писал. Приятно вернуться к истокам (postcss-value-parser).
Следующий челендж - это стили. Было открытием что у аттрибутов самый низкий приоритет. Поэтому конвертировать стили в аттрибуты оставляя стили в <style> - небезопасное занятие. Пришлось отключить плагин.
И все равно много багов в плагинах которые опираются только аттрибуты и инлайн стили.
Пришлось пилить свой аналог getComputedStyle.
Как результат мы имеем универсальное решение с поддержкой наследования, <style>, style= и аттриибутов. Уже три плагина пофикшены с его помощью.
И наконец я начал вести jsunderhood, чтобы рассказать обо всем. Впереди еще много работы.
Самое важное это много новых кейсов для визуальной регрессии.
Развитие идеи getComputedStyle для более надежной работы со стилями.
Замена нынешнего ast формата на "стандарный" xast от автора remark, micromark, mdx. Это позволит интегрировать существующие инструменты и создать универсальную экосистему.
И собственно создать экосистему с множеством инструментов для работы с jsx и другими фреймворкамии.
@jsunderhood Добрый день! Было бы интересно послушать в какой постоянной работе нуждается svgo. Со стороны кажется, что задача конечная. Поэтому было увлекательно послушать про внутренюю кухню
Работа конечная, но обширная. К тому же со временем svg может все таки продолжит развиваться, а новые идеи оптимизаций приходить.
twitter.com/barinbritva/st…