SVG Sprite генератор

HTTP/2 мультиплексирует запросы, но каждый запрос всё равно имеет накладные расходы. Спрайт уменьшает количество файлов и может дать выигрыш на медленных сетях. Для иконок SVG-спрайт (symbol + use) часто удобнее — один запрос, масштабирование без потери качества.

SVG symbol подходит для векторных иконок: один файл, стилизация через CSS, чёткость на любом разрешении. Растровые спрайты нужны для PNG/JPEG, когда важна совместимость со старыми браузерами или используются растровые текстуры.

Генератор обычно располагает изображения в ряд или сетку с заданным gap. Вертикальное выравнивание (по центру строки) уменьшает «рваные» края. Для иконок одинакового размера выравнивание не критично — background-position компенсирует смещения.

Один файл кэшируется целиком. При изменении одной иконки инвалидируется весь спрайт. Разделение на логические группы (иконки UI, соцсети, флаги) позволяет обновлять части независимо. Баланс между количеством запросов и гранулярностью кэша.

Можно создать спрайт в 2x разрешении и использовать background-size для масштабирования. Или генерировать два спрайта (1x и 2x) и переключать через media query для retina. Генератор может поддерживать экспорт в нескольких разрешениях — проверьте документацию инструмента.