Squoosh CLI - скачать полную версию бесплатно на русском

Squoosh CLI: сжатие изображений из командной строки

Squoosh CLI: сжатие изображений из командной строки

Squoosh CLI — это командная версия оптимизатора изображений Squoosh, рассчитанная на пакетное сжатие, конвертацию и подготовку графики для веб-проектов. Программа работает не как классический редактор с окнами, кнопками и панелями, а как инструмент командной строки: пользователь задает кодек, параметры сжатия, папку вывода, список файлов и получает готовые изображения в нужном формате. Главная практическая идея Squoosh CLI проста: один раз подобрать настройки и затем применять их к десяткам или сотням файлов без ручного открытия каждого изображения.

Выбор редакции

Скачать Squoosh CLI бесплатно

Рекомендуем

ФотоМАСТЕР

  • Простой интерфейс
  • Ретушь и замена фона
  • Фильтры и автокоррекция
  • Быстрая обработка фото

Squoosh CLI

  • Только для macOS
  • Не заменяет полноценную ретушь
  • Мало инструментов для Windows
  • Нужно проверять совместимость

В обзоре рассматривается именно Squoosh CLI, а не просто Squoosh как веб-сервис. Веб-версия удобна для визуального сравнения, ручной настройки качества и проверки артефактов, а CLI нужен для автоматизации. Его используют в рабочих папках сайтов, npm scripts, build pipeline, при подготовке картинок для статических генераторов, блогов, лендингов, каталогов товаров и frontend-проектов, где изображения должны быть легче, но не должны заметно терять качество.

Что такое Squoosh CLI и зачем он нужен

Squoosh CLI — это инструмент для оптимизации изображений через командную строку. Он использует те же идеи, что и веб-приложение Squoosh: сжатие через современные кодеки, конвертация в форматы для веба, настройка качества, уменьшение размеров, работа с палитрой и локальная обработка файлов. Разница в том, что в Squoosh.app пользователь работает глазами и мышью, а в Squoosh CLI — командами.

В обычной веб-версии Squoosh пользователь видит стартовый экран с зоной Drop OR Paste, загружает изображение, открывает редактор, выбирает блок Compress, меняет кодек, двигает Quality, включает Resize или Reduce palette, смотрит сравнение до и после и скачивает результат. В Squoosh CLI та же логика переводится в параметры: вместо выбора кодека в выпадающем списке используется флаг --webp, --avif, --mozjpeg или --oxipng; вместо ползунка качества — JSON-конфигурация; вместо кнопки скачивания — выходной файл в указанной папке.

Squoosh CLI особенно полезен там, где ручная обработка становится слишком медленной. Если нужно оптимизировать одну картинку для статьи, проще открыть Squoosh.app. Если нужно прогнать папку с изображениями перед публикацией сайта, командная строка удобнее: команда запускается один раз, а результат получается сразу для всех файлов.

Типичные задачи, которые решает программа:

  • сжатие JPEG через MozJPEG;

  • конвертация JPG и PNG в WebP;

  • создание AVIF-файлов для современных браузеров;

  • lossless-оптимизация PNG через OxiPNG;

  • уменьшение ширины и высоты изображения перед сжатием;

  • сокращение количества цветов через палитру;

  • поворот изображения перед кодированием;

  • пакетная обработка папки;

  • подготовка ассетов для сайта;

  • автоматизация оптимизации через npm scripts;

  • создание нескольких выходных форматов из одного исходника.

Squoosh CLI не заменяет полноценный графический редактор. В нем нет ретуши, слоев, кистей, цветокоррекции, интерфейса кадрирования мышью, пакетного переименования с шаблонами, визуального каталога и встроенного менеджера изображений. Это не Photoshop, не Lightroom и не программа для творческой обработки фотографий. Это точный инструмент для сжатия и конвертации.

История версий Squoosh CLI

История Squoosh CLI связана с развитием Squoosh как экспериментального проекта Chrome Labs. Сначала Squoosh стал заметен как браузерный оптимизатор изображений: пользователь открывал веб-приложение, перетаскивал файл, выбирал кодек и сразу видел визуальное сравнение исходника с результатом. Такой формат хорошо подходил для ручной работы, но плохо закрывал пакетные сценарии: веб-интерфейс удобен для одной картинки, но неудобен для сотен файлов.

Следующим этапом стала командная версия. Squoosh CLI перенес кодеки из Squoosh в терминал и сделал программу полезной для разработчиков. Вместо того чтобы открывать каждое изображение в браузере, пользователь мог вызвать команду, указать папку или маску файлов и получить оптимизированные изображения автоматически. Это превратило Squoosh из ручного веб-инструмента в часть рабочего процесса frontend-разработки.

В развитии Squoosh CLI можно выделить несколько смысловых этапов:

Этап Что изменилось для пользователя
Появление Squoosh как веб-приложения Пользователь получил визуальное сравнение исходного и сжатого изображения, выбор кодека и настройку качества прямо в браузере
Появление CLI-версии Те же задачи стало возможно запускать из терминала и применять к нескольким файлам
Расширение набора кодеков В одной команде стали доступны MozJPEG, WebP, AVIF, OxiPNG, JPEG XL и WebP2
Закрепление пакетных сценариев Инструмент начали использовать в npm scripts, рабочих папках сайтов и автоматизированной подготовке изображений
Стабилизация подхода Squoosh CLI стал восприниматься как удобный, но требующий проверки инструмент для разработчиков, а не как массовый редактор для новичков

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

Поэтому при оценке Squoosh CLI важно смотреть не на внешний интерфейс, а на практический набор возможностей: какие форматы он создает, как задаются настройки, можно ли обработать папку, насколько удобно встроить команду в проект, как ведут себя WebP, AVIF, MozJPEG и OxiPNG на реальных изображениях.

Как выглядит работа с программой

Squoosh CLI не имеет графического окна. Его интерфейс — это терминал. Пользователь пишет команду, программа выводит ход обработки и показывает итог: какие файлы были созданы, какого они размера и насколько уменьшились относительно исходника.

Простейшая логика работы выглядит так:

squoosh-cli --webp '{"quality":80}' -d output photo.jpg

В этой команде каждая часть отвечает за конкретное действие:

Часть команды Значение
squoosh-cli запуск программы
--webp выбор кодека WebP
'{"quality":80}' параметры кодека: качество 80
-d output сохранение результата в папку output
photo.jpg исходный файл

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

В Squoosh CLI нет кнопок вроде Open, Save As, Export или Apply. Вместо них используются параметры:

  • -d или --output-dir — папка вывода;

  • -s или --suffix — суффикс к имени выходного файла;

  • --resize — изменение размера перед сжатием;

  • --quant — уменьшение количества цветов;

  • --rotate — поворот;

  • --mozjpeg — создание JPEG через MozJPEG;

  • --webp — создание WebP;

  • --avif — создание AVIF;

  • --jxl — создание JPEG XL;

  • --wp2 — создание WebP2;

  • --oxipng — оптимизация PNG через OxiPNG;

  • -h или --help — справка по команде.

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

Связь Squoosh CLI с веб-интерфейсом Squoosh

Squoosh CLI проще понять после знакомства с Squoosh.app. В веб-интерфейсе есть визуальная рабочая область: слева исходник, справа результат, по центру вертикальный разделитель для сравнения. Справа находится панель Edit, где расположены блоки Resize, Reduce palette и Compress. В блоке Compress выбирается кодек: например, MozJPEG, WebP или AVIF. Ниже появляются параметры конкретного кодека: Quality, Lossless, Effort, Advanced settings и другие настройки.

Squoosh CLI повторяет эту модель, но без визуального сравнения. Если в веб-интерфейсе пользователь выбирает Compress → AVIF, то в командной строке используется --avif. Если в интерфейсе двигается Quality, то в CLI задается параметр качества в конфигурации кодека. Если в интерфейсе включается Resize, то в CLI добавляется --resize.

Такой подход удобен для двухступенчатой работы:

  1. Открыть одно типовое изображение в Squoosh.app.

  2. Подобрать качество визуально.

  3. Проверить артефакты на мелких деталях, лицах, градиентах, прозрачности и тексте.

  4. Перенести похожие параметры в Squoosh CLI.

  5. Запустить пакетную обработку всей папки.

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

Подготовка к запуску

Squoosh CLI рассчитан на среду Node.js. В рабочем проекте его обычно запускают через npx или как установленную CLI-команду. Для обзора самой программы важнее не способ получения пакета, а формат использования.

Проверка доступности команды:

npx @squoosh/cli --help

или:

squoosh-cli --help

Справка показывает общую схему:

squoosh-cli [options] <files...>

Это означает, что сначала идут параметры обработки, а в конце — один или несколько файлов. Например:

squoosh-cli --webp '{"quality":80}' image.jpg

Для безопасной работы лучше всегда указывать отдельную папку вывода:

squoosh-cli --webp '{"quality":80}' -d output image.jpg

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

На Windows особенно важно следить за кавычками. В PowerShell обычно удобно использовать одинарные кавычки вокруг JSON:

squoosh-cli --webp '{"quality":80}' -d output image.jpg

В Windows Command Prompt чаще требуется экранирование двойных кавычек:

squoosh-cli --webp "{"quality":80}" -d output image.jpg

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

Основные возможности Squoosh CLI

Squoosh CLI хорош тем, что объединяет несколько задач в одном инструменте. Он не ограничивается одним форматом, как узкоспециализированные кодировщики. В одной программе можно сжать JPEG, создать WebP, собрать AVIF, оптимизировать PNG, уменьшить размер изображения и сократить палитру.

Сжатие JPEG через MozJPEG

Флаг --mozjpeg создает JPEG-файл с помощью MozJPEG. Это один из самых востребованных режимов для фотографий, больших иллюстраций, обложек статей, баннеров и изображений без прозрачности.

Пример:

squoosh-cli --mozjpeg '{"quality":80}' -d output photo.png

Если исходник — PNG-файл с фотографическим содержимым, команда создаст JPEG. Это может резко уменьшить размер, но прозрачность будет потеряна, потому что JPEG ее не поддерживает. Поэтому для логотипов, иконок, стикеров, UI-элементов и изображений с прозрачным фоном MozJPEG подходит не всегда.

Более аккуратный вариант:

squoosh-cli --mozjpeg '{"quality":82,"progressive":true,"optimize_coding":true}' -d output photo.jpg

quality задает уровень качества. Для фотографий на сайте разумная стартовая зона — 75–85. Значение ниже может дать заметные артефакты на коже, мелких деталях, листве, волосах и градиентах. Значение выше сохраняет больше деталей, но снижает экономию.

progressive делает JPEG прогрессивным: при загрузке в браузере картинка проявляется постепенно. Для современных сайтов это часто предпочтительнее классического baseline JPEG, особенно на медленных соединениях.

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

Создание WebP

Флаг --webp создает файл WebP. Это один из самых практичных режимов Squoosh CLI для веб-разработки. WebP хорошо подходит для фотографий, иллюстраций, карточек товаров, изображений в блогах и интерфейсной графики. В отличие от JPEG, WebP поддерживает прозрачность, поэтому его можно использовать и для части PNG-графики.

Пример конвертации JPEG в WebP:

squoosh-cli --webp '{"quality":80}' -d output photo.jpg

Пример конвертации PNG в WebP:

squoosh-cli --webp '{"quality":80,"alpha_quality":100}' -d output icon.png

Для изображений с прозрачностью важен параметр alpha_quality. Если фон должен оставаться чистым, а края — аккуратными, прозрачность нельзя сжимать слишком агрессивно. На логотипах, иконках и скриншотах низкое качество альфа-канала быстро дает грязные контуры.

Для lossless-режима можно использовать:

squoosh-cli --webp '{"lossless":1,"quality":100}' -d output logo.png

Lossless WebP стоит выбирать, когда нельзя допустить искажений: например, для логотипов, пиксель-арта, UI-иконок, схем, скриншотов с текстом и графики с резкими границами. При этом lossless не всегда дает меньший файл, чем lossy WebP; результат нужно проверять на конкретных изображениях.

Создание AVIF

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

Пример:

squoosh-cli --avif '{"cqLevel":33,"speed":6}' -d output photo.jpg

Для AVIF в Squoosh CLI ключевой параметр — cqLevel, а не привычное quality. Чем ниже cqLevel, тем выше качество и тем больше файл. Чем выше cqLevel, тем сильнее сжатие и тем выше риск артефактов. Это отличается от WebP и MozJPEG, где пользователь обычно мыслит параметром quality: больше значение — выше качество.

Практический старт для AVIF:

squoosh-cli --avif '{"cqLevel":30,"speed":6}' -d output hero.jpg

Для более сильного сжатия:

squoosh-cli --avif '{"cqLevel":38,"speed":6}' -d output hero.jpg

Для более высокого качества:

squoosh-cli --avif '{"cqLevel":24,"speed":4}' -d output hero.jpg

speed влияет на скорость кодирования и эффективность результата. Меньшие значения обычно требуют больше времени, но могут дать более качественное сжатие. Для массовой обработки больших папок не стоит сразу выбирать самый медленный режим: сначала лучше проверить результат на небольшой выборке.

AVIF особенно хорошо использовать для:

  • больших hero-изображений;

  • фотографий в статьях;

  • промо-баннеров;

  • фоновых изображений;

  • галерей;

  • изображений, где критичен вес страницы.

Но AVIF требует проверки. На некоторых картинках он может давать неприятные артефакты: пластиковую текстуру кожи, грязные градиенты, смазанную листву, странные ореолы вокруг контрастных объектов. Поэтому для AVIF ручной контроль важнее, чем для простого WebP.

Оптимизация PNG через OxiPNG

Флаг --oxipng оптимизирует PNG без перехода в другой формат. Это режим для ситуаций, когда файл должен остаться PNG: прозрачность, совместимость, точные цвета, графика интерфейса, технические скриншоты, логотипы, иконки.

Пример:

squoosh-cli --oxipng '{"level":2}' -d output image.png

OxiPNG не превращает PNG в фотографический формат и не делает агрессивную потерю качества. Его задача — перепаковать PNG эффективнее. Поэтому не стоит ждать от OxiPNG такого же уменьшения, как от WebP или AVIF на тяжелых фотографиях. Зато он подходит для аккуратной lossless-оптимизации.

Для PNG-графики есть два подхода:

Задача Подход
Нужно сохранить PNG и не менять визуально изображение --oxipng
Можно уменьшить количество цветов --quant вместе с последующим сжатием
Можно перейти в современный формат --webp или --avif
Изображение фотографическое часто выгоднее MozJPEG, WebP или AVIF
Изображение содержит прозрачность WebP/AVIF/PNG, в зависимости от требований поддержки

JPEG XL и WebP2

Squoosh CLI поддерживает флаги --jxl и --wp2. Это режимы для экспериментальных или тестовых сценариев. В обычном production-процессе их нужно применять осторожно, потому что вопрос поддержки форматов в браузерах и инструментах важнее самого факта, что кодек может создать файл.

Пример JPEG XL:

squoosh-cli --jxl '{"quality":80,"effort":7}' -d output image.png

Пример WebP2:

squoosh-cli --wp2 '{"quality":80,"effort":5}' -d output image.png

Эти режимы интересны для сравнения качества кодеков, лабораторных тестов, архивных экспериментов и оценки новых форматов. Для массовой публикации на сайте обычно практичнее WebP и AVIF, а для PNG без потерь — OxiPNG.

Resize: изменение размера перед сжатием

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

Пример:

squoosh-cli --resize '{"width":1200,"height":800,"method":"lanczos3","premultiply":true,"linearRGB":true}' --webp '{"quality":80}' -d output photo.jpg

Если изображение загружено с камеры в размере 6000×4000 пикселей, а на сайте показывается в блоке шириной 1200 пикселей, один только кодек не решит проблему правильно. Сначала нужно уменьшить геометрию, затем сжать. Squoosh CLI позволяет сделать это в одной команде.

В параметрах --resize чаще всего важны:

Параметр Значение
width новая ширина
height новая высота
method алгоритм изменения размера
premultiply корректная обработка альфа-канала при ресайзе
linearRGB обработка цвета в линейном RGB

Метод lanczos3 обычно выбирают как качественный вариант для уменьшения фотографий и иллюстраций. Для быстрой массовой обработки можно тестировать и другие методы, но без визуальной проверки менять алгоритм не стоит.

Reduce palette: уменьшение количества цветов

Флаг --quant уменьшает количество цветов в изображении. Это полезно для PNG-графики, иконок, схем, простых иллюстраций и изображений с ограниченной палитрой.

Пример:

squoosh-cli --quant '{"numColors":128,"dither":1}' --oxipng '{"level":2}' -d output ui.png

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

Практические ориентиры:

Тип изображения Стартовое значение numColors
простая иконка 32–64
плоская иллюстрация 64–128
скриншот интерфейса 128–256
изображение с градиентами 256 или отказ от палитры
фотография обычно не лучший кандидат для --quant

--quant не универсален. На скриншотах с текстом он может работать хорошо, а на фотографиях часто портит плавные переходы и кожу. Его задача — не сжать все подряд, а сократить палитру там, где это визуально приемлемо.

Rotate: поворот изображения

Флаг --rotate выполняет поворот перед сжатием.

Пример:

squoosh-cli --rotate '{"numRotations":1}' --webp '{"quality":80}' -d output image.jpg

numRotations задает количество поворотов на 90 градусов. Значение 1 — 90 градусов, 2 — 180 градусов, 3 — 270 градусов. Это простая, но полезная функция при пакетной подготовке файлов, если часть исходников загружена с неправильной ориентацией.

Практическая инструкция: как сжать одно изображение

Для одиночной картинки Squoosh CLI удобен, когда уже понятно, какой формат нужен на выходе. Например, есть файл photo.jpg, его нужно превратить в WebP и сохранить результат в папку output.

Шаг 1. Открыть терминал в папке с изображением.

Шаг 2. Проверить, что команда запускается:

npx @squoosh/cli --help

Шаг 3. Создать WebP:

npx @squoosh/cli --webp '{"quality":80}' -d output photo.jpg

Шаг 4. Проверить файл в папке output.

После обработки в папке появится файл с расширением .webp. Программа покажет результат в терминале: исходный размер, новый размер и процент уменьшения. Именно этот вывод удобен при быстрых тестах: пользователь сразу видит, насколько оправдана выбранная настройка.

Для JPEG через MozJPEG команда будет такой:

npx @squoosh/cli --mozjpeg '{"quality":82,"progressive":true}' -d output photo.jpg

Для AVIF:

npx @squoosh/cli --avif '{"cqLevel":32,"speed":6}' -d output photo.jpg

Для PNG без смены формата:

npx @squoosh/cli --oxipng '{"level":2}' -d output image.png

После каждой команды нужно смотреть не только на процент уменьшения. Сжатый файл нужно открыть и проверить:

  • не появился ли шум на лице;

  • не испортились ли градиенты;

  • не стали ли мелкие детали кашей;

  • не изменился ли цвет логотипа;

  • не потерялась ли прозрачность;

  • не стали ли буквы размытыми;

  • не появились ли ореолы на контрастных границах.

Главная ошибка новичков — выбрать слишком низкое качество, увидеть красивый процент уменьшения и не проверить изображение глазами. Для оптимизации сайта это плохой подход: картинка может стать легкой, но визуально дешевой.

Практическая инструкция: пакетная обработка папки

Сильная сторона Squoosh CLI — пакетная обработка. Программа принимает несколько файлов и может применить к ним один и тот же кодек.

Пример для всех JPG в текущей папке:

squoosh-cli --webp '{"quality":80}' -d output *.jpg

Пример для всех PNG:

squoosh-cli --oxipng '{"level":2}' -d output *.png

Пример для нескольких расширений:

squoosh-cli --webp '{"quality":80}' -d output *.jpg *.png

Пример создания AVIF из JPEG:

squoosh-cli --avif '{"cqLevel":32,"speed":6}' -d output *.jpg

При пакетной обработке лучше соблюдать порядок:

  1. Создать отдельную папку с исходниками.

  2. Создать отдельную папку вывода.

  3. Запустить команду сначала на 3–5 файлах.

  4. Проверить визуальное качество.

  5. Проверить размер.

  6. Только после этого запускать всю папку.

Для реального проекта безопаснее использовать такую структуру:

project/  images-src/    hero.jpg    card-1.jpg    card-2.jpg    logo.png  images-optimized/

Команда:

squoosh-cli --webp '{"quality":80}' -d images-optimized images-src/*.jpg

Так исходники остаются нетронутыми, а оптимизированные файлы лежат отдельно. Это важно для работы в команде: дизайнер или контент-менеджер может сохранить исходники, разработчик — сжать копии, а сайт — использовать только оптимизированные изображения.

Создание нескольких форматов из одного набора исходников

Squoosh CLI позволяет запускать разные кодеки отдельными командами. Это удобно, когда для сайта нужны и WebP, и AVIF.

Пример:

squoosh-cli --webp '{"quality":80}' -d public/images/webp src/images/*.jpg
squoosh-cli --avif '{"cqLevel":32,"speed":6}' -d public/images/avif src/images/*.jpg

После этого в разметке можно использовать <picture>:

<picture>  <source srcset="/images/avif/hero.avif" type="image/avif">  <source srcset="/images/webp/hero.webp" type="image/webp">  <img src="/images/hero.jpg" alt="Описание изображения" width="1200" height="800"></picture>

Squoosh CLI не пишет HTML за пользователя. Его задача — подготовить файлы. Но в веб-проектах именно такая связка часто дает лучший результат: AVIF для браузеров, которые его поддерживают, WebP как более совместимый современный вариант и исходный JPEG или PNG как fallback.

Настройки кодеков и как их подбирать

В Squoosh CLI нет универсальной настройки, которая идеально подходит для всех изображений. Один и тот же quality:80 может выглядеть отлично на фотографии и плохо на скриншоте с мелким текстом. Поэтому настройки нужно подбирать по типу изображения.

Фотографии

Для фотографий обычно подходят MozJPEG, WebP и AVIF.

Стартовые команды:

squoosh-cli --mozjpeg '{"quality":82,"progressive":true}' -d output photo.jpg
squoosh-cli --webp '{"quality":80}' -d output photo.jpg
squoosh-cli --avif '{"cqLevel":32,"speed":6}' -d output photo.jpg

Что проверять:

  • кожу и лица;

  • волосы;

  • листву;

  • небо;

  • воду;

  • мягкие градиенты;

  • темные участки;

  • мелкие контрастные детали.

Для фотографий AVIF часто дает сильную экономию, но WebP быстрее и предсказуемее. MozJPEG хорош, если нужно сохранить JPEG как формат или обеспечить максимальную совместимость.

Скриншоты интерфейса

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

Стартовые варианты:

squoosh-cli --webp '{"quality":90}' -d output screenshot.png
squoosh-cli --oxipng '{"level":2}' -d output screenshot.png
squoosh-cli --quant '{"numColors":256,"dither":1}' --oxipng '{"level":2}' -d output screenshot.png

Для скриншотов с текстом лучше начинать с высокого качества. Если текст становится мутным, формат или настройки выбраны неправильно.

Логотипы и иконки

Для логотипов и иконок важны чистые края, прозрачность и точный цвет. JPEG обычно не подходит. Лучше использовать PNG, WebP lossless или AVIF с аккуратными параметрами.

Примеры:

squoosh-cli --oxipng '{"level":2}' -d output logo.png
squoosh-cli --webp '{"lossless":1,"quality":100}' -d output logo.png
squoosh-cli --quant '{"numColors":64,"dither":0.8}' --oxipng '{"level":2}' -d output icon.png

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

Иллюстрации

Иллюстрации бывают разными. Плоская векторная графика, экспортированная в PNG, может хорошо сжиматься через палитру. Сложная растровая иллюстрация иногда лучше уходит в WebP или AVIF.

Стартовые варианты:

squoosh-cli --webp '{"quality":82}' -d output illustration.png
squoosh-cli --avif '{"cqLevel":30,"speed":6}' -d output illustration.png
squoosh-cli --quant '{"numColors":128,"dither":1}' --oxipng '{"level":2}' -d output illustration.png

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

Примеры команд для типовых задач

Задача Команда Когда использовать
JPG в WebP squoosh-cli --webp '{"quality":80}' -d output *.jpg Фотографии, карточки товаров, статьи, лендинги
JPG в AVIF squoosh-cli --avif '{"cqLevel":32,"speed":6}' -d output *.jpg Максимальное уменьшение веса для современных браузеров
PNG без потерь squoosh-cli --oxipng '{"level":2}' -d output *.png Логотипы, скриншоты, UI-графика
PNG в WebP с прозрачностью squoosh-cli --webp '{"quality":85,"alpha_quality":100}' -d output *.png Иконки, иллюстрации, элементы интерфейса
Уменьшить размер и создать WebP squoosh-cli --resize '{"width":1200,"height":800,"method":"lanczos3","premultiply":true,"linearRGB":true}' --webp '{"quality":80}' -d output *.jpg Большие фото из камеры или CMS
Сократить палитру PNG squoosh-cli --quant '{"numColors":128,"dither":1}' --oxipng '{"level":2}' -d output *.png Плоские иллюстрации, схемы, простые PNG
Создать прогрессивный JPEG squoosh-cli --mozjpeg '{"quality":82,"progressive":true}' -d output *.jpg Нужно оставить JPEG, но уменьшить вес
Добавить суффикс squoosh-cli --webp '{"quality":80}' -s "-optimized" -d output image.jpg Нужно сохранить понятные имена файлов
Повернуть и сжать squoosh-cli --rotate '{"numRotations":1}' --webp '{"quality":80}' -d output image.jpg Исходники с неправильной ориентацией
Проверить справку squoosh-cli --help Быстро посмотреть доступные параметры

Использование в npm scripts

Squoosh CLI хорошо вписывается в Node.js-проекты. Команды можно вынести в package.json, чтобы не писать длинные параметры каждый раз.

Пример:

{  "scripts": {    "images:webp": "squoosh-cli --webp '{"quality":80}' -d public/images/webp src/images/*.jpg",    "images:avif": "squoosh-cli --avif '{"cqLevel":32,"speed":6}' -d public/images/avif src/images/*.jpg",    "images:png": "squoosh-cli --oxipng '{"level":2}' -d public/images/png src/images/*.png"  }}

После этого можно запускать:

npm run images:webp
npm run images:avif
npm run images:png

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

В больших проектах команды можно разделять по папкам:

{  "scripts": {    "images:blog": "squoosh-cli --webp '{"quality":80}' -d public/blog src/blog-images/*.jpg",    "images:products": "squoosh-cli --webp '{"quality":82}' -d public/products src/product-images/*.jpg",    "images:icons": "squoosh-cli --oxipng '{"level":2}' -d public/icons src/icons/*.png"  }}

Это полезно, потому что разные типы изображений требуют разных настроек. Карточки товаров, блоговые фотографии и иконки не стоит сжимать одной универсальной командой.

Качество сжатия: как оценивать результат

Squoosh CLI показывает размер результата, но не показывает визуальное сравнение в терминале. Поэтому качество нужно контролировать вручную. Лучший способ — взять несколько типовых изображений, прогнать их через команду и открыть рядом с исходниками.

Оценивать нужно не только общий вид. Важны проблемные зоны:

Зона проверки Что может пойти не так
Лица пластик, грязные пятна, потеря текстуры кожи
Волосы смазывание тонких деталей
Небо и градиенты полосы, пятна, ступеньки цвета
Текст размытие, цветные ореолы, потеря четкости
Логотипы искажение цвета, грязные края
Прозрачность светлая или темная кайма вокруг объекта
Тени пятна и блоки
Мелкая графика потеря линий и пиктограмм
Красные и синие детали артефакты цветовой субдискретизации

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

Для сайта нужно проверять еще и размеры изображения в HTML или CSS. Если файл уменьшен до 1200 пикселей, а показывается на 360 пикселях, возможно, стоит создать отдельный мобильный вариант. Squoosh CLI сам не проектирует responsive images, но хорошо готовит исходные файлы для таких сценариев.

Производительность и ограничения

Squoosh CLI удобен для пакетной оптимизации, но не стоит воспринимать его как самый быстрый компрессор во всех задачах. Его сила — набор кодеков и простая автоматизация, а не абсолютный рекорд скорости.

Основные ограничения:

  • AVIF может кодироваться заметно медленнее WebP и JPEG;

  • большие изображения требуют больше памяти;

  • сложные папки лучше обрабатывать партиями;

  • параметры JSON неудобны для новичков;

  • на Windows возможны проблемы с кавычками;

  • для некоторых задач специализированные утилиты быстрее;

  • CLI не дает визуального предпросмотра;

  • результат нужно проверять отдельно.

Squoosh CLI использует worker pool для параллельной обработки. Это помогает при пакетной работе, но не отменяет стоимости кодирования. Если папка содержит сотни больших фотографий, особенно с AVIF, обработка может занять заметное время.

Практический подход:

  1. Сначала протестировать 5–10 файлов.

  2. Сравнить WebP, AVIF и MozJPEG.

  3. Выбрать настройки.

  4. Запустить всю папку.

  5. Проверить несколько случайных результатов.

  6. Только после этого отправлять изображения в проект.

Для production-процессов лучше не полагаться на одну команду вслепую. Изображения сильно различаются: портреты, скриншоты, логотипы и фоновые фото по-разному реагируют на один и тот же кодек.

Безопасность и приватность

Ключевая особенность Squoosh-подхода — локальная обработка. В веб-версии Squoosh изображение обрабатывается в браузере, а Squoosh CLI работает на локальной машине через командную строку. Это отличает его от многих онлайн-компрессоров, куда пользователь загружает файлы на сторонний сервер.

Для рабочих изображений это важно. Если в папке есть внутренние скриншоты, макеты, еще не опубликованные товары, закрытые баннеры, клиентские материалы или изображения для проекта под NDA, локальная обработка безопаснее, чем загрузка в случайный веб-сервис.

Но локальная обработка не отменяет дисциплину работы с npm-пакетами и зависимостями. В нормальном рабочем процессе Squoosh CLI нужно закреплять в проекте, использовать понятные команды и не запускать случайные скрипты из неизвестных источников. Сама идея Squoosh CLI хороша именно тем, что файл не нужно отправлять в облачный оптимизатор ради простого сжатия.

Плюсы Squoosh CLI

Squoosh CLI удобен прежде всего как инструмент разработчика. Его не нужно оценивать по критериям графического редактора. У него другая сильная сторона: он превращает оптимизацию изображений в повторяемую команду.

Главные плюсы:

  • поддерживает несколько кодеков в одном CLI;

  • подходит для пакетной обработки;

  • умеет создавать WebP и AVIF;

  • умеет сжимать JPEG через MozJPEG;

  • умеет оптимизировать PNG через OxiPNG;

  • поддерживает resize перед сжатием;

  • поддерживает сокращение палитры;

  • может использоваться в npm scripts;

  • хорошо подходит для подготовки ассетов сайта;

  • обрабатывает файлы локально;

  • помогает стандартизировать качество изображений в проекте;

  • позволяет быстро повторять одинаковые настройки;

  • удобен для frontend workflow.

Особенно сильный сценарий — автоматизация для статического сайта или frontend-проекта. Например, в папку src/images складываются исходники, а команда создает оптимизированные файлы в public/images. Такой процесс понятен, повторяем и не зависит от ручной памяти пользователя.

Минусы Squoosh CLI

Минусы Squoosh CLI тоже очевидны. Это не массовая программа для человека, который не хочет видеть терминал. Новичку проще открыть Squoosh.app, перетащить картинку в Drop OR Paste, выбрать кодек в Compress, подвигать Quality и нажать кнопку скачивания.

Основные минусы:

  • нет полноценного графического интерфейса;

  • нужно понимать командную строку;

  • JSON-параметры выглядят громоздко;

  • кавычки могут отличаться в Bash, PowerShell и CMD;

  • нет встроенной визуальной проверки результата;

  • нет удобного каталога изображений;

  • нет пакетного переименования с шаблонами уровня специализированных GUI-программ;

  • нет ретуши, кадрирования мышью и редакторских инструментов;

  • AVIF может работать медленно на больших наборах файлов;

  • параметры AVIF менее интуитивны, чем обычный quality;

  • для некоторых задач лучше использовать отдельные специализированные утилиты.

Главный практический недостаток — отсутствие визуального контроля в момент обработки. Команда может успешно создать десятки файлов, но пользователь все равно должен открыть результат и проверить качество. В этом смысле Squoosh CLI эффективен только тогда, когда настройки уже подобраны.

Сравнение с аналогами

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

Программа Сильные стороны Слабые стороны Когда выбрать
ImageMagick Огромный набор операций: конвертация, resize, crop, rotate, эффекты, работа с множеством форматов Синтаксис сложнее, оптимизация WebP/AVIF не всегда является главным фокусом Когда нужна универсальная обработка изображений, а не только сжатие
Sharp Высокая скорость, сильная интеграция с Node.js, удобная библиотека для серверов и build-процессов Это скорее библиотека и инструмент для разработки, чем простой CLI для ручного запуска Когда нужен production-пайплайн, API, генерация размеров и автоматизация в коде
cwebp Быстрый и точный инструмент для WebP, много параметров качества и режима lossless Работает только с WebP, для AVIF/JPEG/PNG нужны другие утилиты Когда задача — массово создать WebP
avifenc Гибкий AVIF-кодировщик с точной настройкой качества, скорости и кодека Сложнее для новичка, требует понимания AVIF-параметров Когда нужен тонкий контроль AVIF
pngquant Очень хорошо уменьшает PNG за счет палитры и lossy-подхода Может менять цвета, не подходит там, где нужна строгая визуальная точность Когда нужно резко уменьшить PNG-иконки, схемы и простую графику
oxipng Надежная lossless-оптимизация PNG Не переводит изображение в современные форматы и не дает такой экономии, как lossy-кодеки Когда PNG должен остаться PNG
TinyPNG Очень простой веб-интерфейс и API, хорошо подходит для ручной быстрой оптимизации Файлы отправляются во внешний сервис, есть ограничения и зависимость от сервиса Когда важна простота, а не локальный CLI
Caesium Image Compressor Удобный графический интерфейс, пакетная обработка, понятен пользователям без терминала Меньше подходит для npm scripts и автоматизации в frontend-проекте Когда нужен визуальный настольный компрессор
RIOT Хорош для ручной настройки JPEG/PNG/GIF с предпросмотром Менее удобен для современного frontend-пайплайна и автоматизации Когда нужно вручную подобрать качество с визуальным контролем

Squoosh CLI выигрывает у многих аналогов тем, что объединяет разные кодеки в одном интерфейсе командной строки. Не нужно держать отдельно MozJPEG, cwebp, avifenc и oxipng для базовых задач. Но специализированные инструменты выигрывают там, где нужен максимальный контроль конкретного формата.

Например, для одной задачи создать WebP из тысячи JPG cwebp может быть прямее и быстрее. Для сложного AVIF-процесса avifenc даст более глубокий контроль. Для Node.js-сервиса Sharp будет естественнее, потому что его можно встроить прямо в код. Для ручной работы новичка Caesium или Squoosh.app будут понятнее.

Кому подойдет Squoosh CLI

Squoosh CLI подходит пользователям, которые уже работают с файлами и терминалом. Это не обязательно должен быть профессиональный инженер, но базовое понимание командной строки нужно.

Программа хорошо подойдет:

  • frontend-разработчикам;

  • веб-мастерам;

  • техническим SEO-специалистам;

  • разработчикам статических сайтов;

  • владельцам блогов на генераторах вроде Astro, Eleventy, Hugo или Gatsby;

  • контент-менеджерам, которые умеют работать с терминалом;

  • дизайнерам, готовящим ассеты пачками;

  • командам, где нужно стандартизировать оптимизацию изображений;

  • разработчикам, которые хотят добавить сжатие в npm scripts.

Лучший пользователь Squoosh CLI — человек, которому нужно не один раз сжать картинку, а регулярно готовить изображения по одинаковым правилам. Для разовой задачи CLI может показаться лишним. Для повторяемого процесса он экономит время.

Кому лучше выбрать другую программу

Squoosh CLI не стоит навязывать всем. У него четкая аудитория, и за ее пределами есть более удобные решения.

Лучше выбрать другой инструмент, если:

  • пользователь не хочет работать с терминалом;

  • нужно визуально кадрировать изображения мышью;

  • требуется ретушь, цветокоррекция, слои или маски;

  • нужна сложная пакетная переименовка;

  • нужен встроенный просмотр каталога;

  • нужна максимальная скорость только для WebP;

  • нужен низкоуровневый контроль AVIF;

  • нужно серверное API внутри приложения;

  • нужно обрабатывать изображения в графическом интерфейсе.

Для ручной оптимизации одной картинки лучше использовать Squoosh.app. Для тяжелой production-автоматизации в Node.js часто логичнее Sharp. Для чистого WebP — cwebp. Для чистого AVIF — avifenc. Для PNG без потерь — oxipng. Для PNG с потерей части цветов — pngquant.

Типичные ошибки при работе

Ошибка 1. Использовать JPEG для изображения с прозрачностью

Если исходник — PNG с прозрачным фоном, команда с --mozjpeg создаст JPEG и прозрачность исчезнет. Вместо прозрачности появится фон, чаще всего белый или черный в зависимости от обработки. Для логотипов и иконок это критично.

Правильнее использовать:

squoosh-cli --webp '{"lossless":1,"quality":100}' -d output logo.png

или:

squoosh-cli --oxipng '{"level":2}' -d output logo.png

Ошибка 2. Слишком низкое качество

Команда вроде:

squoosh-cli --webp '{"quality":40}' -d output *.jpg

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

Лучше начинать с 80 и снижать постепенно:

squoosh-cli --webp '{"quality":80}' -d output *.jpg

Ошибка 3. Неправильный параметр для AVIF

Для WebP и MozJPEG пользователь привык к quality, но в AVIF-режиме Squoosh CLI нужно работать с cqLevel.

Плохой вариант:

squoosh-cli --avif '{"quality":40}' image.png

Хороший вариант:

squoosh-cli --avif '{"cqLevel":32,"speed":6}' image.png

Ошибка 4. Не указывать папку вывода

При пакетной обработке лучше не смешивать исходники и результаты. Команда без -d может создать файлы рядом с исходниками, что быстро приводит к беспорядку.

Лучше:

squoosh-cli --webp '{"quality":80}' -d output *.jpg

Ошибка 5. Обрабатывать все изображения одной настройкой

Фотографии, скриншоты, иконки и логотипы требуют разных подходов. Нельзя взять одну команду и одинаково хорошо применить ее ко всем типам графики.

Разумное разделение:

squoosh-cli --webp '{"quality":80}' -d output/photos src/photos/*.jpg
squoosh-cli --oxipng '{"level":2}' -d output/icons src/icons/*.png
squoosh-cli --webp '{"lossless":1,"quality":100}' -d output/logos src/logos/*.png

Ошибка 6. Сжимать уже пережатые изображения

Если исходник уже сильно сжат, повторное lossy-сжатие может не дать большой экономии, но ухудшит качество. Особенно это заметно на JPEG, который уже прошел через мессенджеры, CMS или социальные сети.

Ошибка 7. Не проверять результат на сайте

Изображение может нормально выглядеть в просмотрщике, но плохо смотреться на реальной странице: слишком маленькое разрешение, неверные размеры, размытость на Retina, неправильный fallback, неподходящий формат для конкретного браузера. Squoosh CLI готовит файл, но финальную проверку нужно делать в контексте страницы.

Практические рекомендации по настройкам

Для рабочих задач удобно держать несколько стартовых пресетов.

Фотографии для сайта

squoosh-cli --resize '{"width":1600,"height":1067,"method":"lanczos3","premultiply":true,"linearRGB":true}' --webp '{"quality":80}' -d output *.jpg

Подходит для блогов, лендингов, галерей и промо-блоков. Если сайт использует AVIF, можно дополнительно создать AVIF:

squoosh-cli --resize '{"width":1600,"height":1067,"method":"lanczos3","premultiply":true,"linearRGB":true}' --avif '{"cqLevel":32,"speed":6}' -d output-avif *.jpg

Превью карточек товаров

squoosh-cli --resize '{"width":800,"height":800,"method":"lanczos3","premultiply":true,"linearRGB":true}' --webp '{"quality":82}' -d output *.jpg

Карточки товаров требуют аккуратности: товар должен выглядеть четко, без грязных краев и цветовых сдвигов. Слишком сильное сжатие может ухудшить доверие к карточке.

Скриншоты

squoosh-cli --webp '{"quality":90}' -d output *.png

или без смены формата:

squoosh-cli --oxipng '{"level":2}' -d output *.png

Если в скриншоте много текста, лучше не снижать качество агрессивно.

Иконки и простая PNG-графика

squoosh-cli --quant '{"numColors":64,"dither":0.8}' --oxipng '{"level":2}' -d output *.png

Для иконок нужно проверять контуры и цвета. Если появляются ступеньки, грязь или цветовые пятна, нужно увеличить numColors или отказаться от палитры.

Логотипы

squoosh-cli --oxipng '{"level":2}' -d output logo.png

или:

squoosh-cli --webp '{"lossless":1,"quality":100}' -d output logo.png

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

Работа с именами файлов и папками

Флаг -d задает папку вывода:

squoosh-cli --webp '{"quality":80}' -d output image.jpg

Флаг -s добавляет суффикс:

squoosh-cli --webp '{"quality":80}' -s "-webp" -d output image.jpg

Это удобно, когда нужно сохранить понятную структуру. Например, исходник называется hero.jpg, а результат — hero-webp.webp.

Для папок с большим количеством файлов лучше заранее продумать структуру:

src/  images/    original/    webp/    avif/    png/

В таком процессе меньше риска перепутать исходники и оптимизированные изображения.

Использование в реальном frontend workflow

В типичном frontend-проекте Squoosh CLI можно встроить в подготовку ассетов так:

src/images/raw/        исходникиsrc/images/webp/       WebP-версииsrc/images/avif/       AVIF-версииpublic/images/         изображения для публикации

Команды:

squoosh-cli --webp '{"quality":80}' -d src/images/webp src/images/raw/*.jpg
squoosh-cli --avif '{"cqLevel":32,"speed":6}' -d src/images/avif src/images/raw/*.jpg

Для проекта это дает несколько преимуществ:

  • исходники не теряются;

  • оптимизированные файлы создаются повторяемо;

  • настройки можно хранить в package.json;

  • команда может быть частью подготовки релиза;

  • новые изображения обрабатываются тем же способом, что и старые;

  • проще контролировать вес страниц.

Squoosh CLI особенно хорошо подходит для проектов, где нет отдельного image CDN или сложного серверного преобразования изображений. Если изображения готовятся заранее и кладутся в репозиторий или статическую папку, CLI полностью закрывает базовую оптимизацию.

Контроль результата после обработки

После запуска Squoosh CLI нужно проверить не только изображения, но и структуру результата.

Минимальный чек-лист:

  • все нужные файлы созданы;

  • расширения соответствуют выбранным форматам;

  • имена файлов не конфликтуют;

  • исходники не были случайно заменены;

  • прозрачность сохранилась там, где нужна;

  • размеры изображений соответствуют макету;

  • вес действительно уменьшился;

  • изображения открываются в целевых браузерах;

  • HTML или CSS ссылаются на правильные пути;

  • fallback работает, если используется <picture>.

Для сайта полезно отдельно проверить LCP-изображения: hero-блоки, большие баннеры, первые изображения в статье. Именно они часто сильнее всего влияют на ощущение скорости загрузки. Squoosh CLI может уменьшить их вес, но неправильный размер или слишком агрессивное качество испортят визуальное впечатление.

Расширенные сценарии

Создание WebP и AVIF одновременно через две команды

squoosh-cli --webp '{"quality":80}' -d dist/webp src/*.jpgsquoosh-cli --avif '{"cqLevel":32,"speed":6}' -d dist/avif src/*.jpg

Такой вариант удобен для сайтов, где используется современная разметка с fallback.

Отдельная обработка больших изображений

squoosh-cli --resize '{"width":1920,"height":1080,"method":"lanczos3","premultiply":true,"linearRGB":true}' --webp '{"quality":78}' -d output-large src/hero/*.jpg

Для hero-изображений часто достаточно ширины 1600–1920 пикселей. Если исходник больше, уменьшение размера даст больше пользы, чем снижение качества.

Подготовка миниатюр

squoosh-cli --resize '{"width":480,"height":320,"method":"lanczos3","premultiply":true,"linearRGB":true}' --webp '{"quality":80}' -d thumbnails src/*.jpg

Squoosh CLI не создает сложную систему responsive images сам, но помогает подготовить набор размеров.

Оптимизация PNG после уменьшения палитры

squoosh-cli --quant '{"numColors":128,"dither":1}' --oxipng '{"level":2}' -d output src/*.png

Этот вариант хорошо подходит для плоских иллюстраций, схем и простых PNG, но требует проверки цветов.

Разбор интерфейсных элементов Squoosh, которые важны для CLI

Хотя Squoosh CLI не имеет графического интерфейса, многие его параметры проще понимать через Squoosh.app.

В веб-интерфейсе пользователь видит:

Элемент Squoosh.app Аналог в Squoosh CLI
Drop OR Paste передача пути к файлу в конце команды
Resize --resize
Reduce palette --quant
Compress выбор --mozjpeg, --webp, --avif, --oxipng
Quality quality для WebP/MozJPEG, cqLevel для AVIF
Lossless lossless в конфигурации кодека
Advanced settings расширенные JSON-параметры
кнопка скачивания сохранение файла в выходную папку
индикатор размера вывод результата в терминале
вертикальный comparison slider ручная проверка в Squoosh.app или просмотрщике

Именно поэтому Squoosh.app и Squoosh CLI хорошо дополняют друг друга. Веб-интерфейс помогает подобрать настройки, а CLI применяет их массово. Это не конкурирующие способы работы, а две формы одного подхода.

Подход к WebP, AVIF, JPEG и PNG в одной программе

Squoosh CLI удобен тем, что не заставляет пользователя мыслить одним форматом. Для сайта редко достаточно одного решения. Фотографии можно отдавать в WebP и AVIF, логотипы оставить в PNG или WebP lossless, скриншоты с текстом сжимать аккуратнее, а старые JPEG оптимизировать через MozJPEG.

Практическая схема выбора:

Исходник Что выбрать Почему
Фотография JPG WebP или AVIF Хорошая экономия для веба
Фотография PNG WebP, AVIF или MozJPEG PNG для фото обычно слишком тяжелый
Логотип PNG OxiPNG или WebP lossless Важны прозрачность и чистые края
Скриншот PNG WebP высокого качества или OxiPNG Важна четкость текста
Плоская иллюстрация WebP или quant + OxiPNG Можно уменьшить палитру
Большой баннер Resize + WebP/AVIF Сначала размер, потом кодек
Изображение с текстом WebP высокого качества Нельзя агрессивно терять детали

Главное — не выбирать формат механически. WebP не всегда лучше PNG, AVIF не всегда лучше WebP, а JPEG не всегда плох. Задача Squoosh CLI — дать набор инструментов, а не принять за пользователя визуальное решение.

Оценка удобства

Squoosh CLI удобен для тех, кто любит повторяемость. В графическом редакторе пользователь каждый раз делает действия руками: открыть, выбрать формат, выставить качество, сохранить. В CLI эти действия превращаются в команду, которую можно скопировать, сохранить, повторить и передать другому человеку.

Удобство проявляется в трех вещах:

  1. Повторяемость. Одна команда дает одинаковый результат для всех файлов.

  2. Пакетность. Можно обработать папку, а не одну картинку.

  3. Интеграция. Команды можно встроить в проект.

Но для новичка CLI может быть неудобным. Синтаксис JSON, кавычки, маски файлов, выходные папки и разные параметры кодеков требуют внимательности. Squoosh CLI — программа не для нажал кнопку и готово, а для управляемого процесса.

Оценка качества

По качеству результата Squoosh CLI зависит от выбранного кодека и параметров. В этом его честная особенность: программа не обещает магическое сжатие без решений пользователя. Она дает хорошие инструменты, но требует понимания.

MozJPEG хорошо подходит для JPEG-фотографий. WebP дает надежный баланс качества, веса и поддержки. AVIF часто дает максимальную экономию, но требует больше времени и проверки. OxiPNG аккуратно оптимизирует PNG без смены формата. --quant может сильно уменьшить PNG, но может испортить цвета, если применить его бездумно.

Если оценивать Squoosh CLI как инструмент для подготовки изображений к публикации на сайте, качество можно назвать высоким при правильном подборе настроек. Если оценивать его как автоматический компрессор для всего, результат будет нестабильным: разные типы изображений требуют разных команд.

Оценка скорости

Скорость Squoosh CLI нормальная для пакетных задач, но не рекордная. WebP и MozJPEG обычно воспринимаются комфортно. OxiPNG тоже подходит для регулярной работы. AVIF может быть медленным, особенно на больших изображениях и при более качественных настройках.

Для небольшого сайта это не проблема. Для папки из 20–100 изображений Squoosh CLI вполне практичен. Для больших каталогов товаров, где тысячи картинок нужно обрабатывать регулярно, стоит сравнить скорость с Sharp, cwebp, avifenc и серверными пайплайнами.

Практический вывод простой: Squoosh CLI хорош для локальной подготовки и средних партий изображений. Для высоконагруженной промышленной обработки нужно тестировать его на реальном объеме.

Что можно улучшить в рабочем процессе

Чтобы Squoosh CLI приносил пользу, лучше не использовать его хаотично. Нужны правила.

Хорошая организация:

  • отдельная папка для исходников;

  • отдельная папка для результата;

  • разные команды для разных типов изображений;

  • сохраненные npm scripts;

  • визуальная проверка после изменения настроек;

  • тестирование на нескольких типовых файлах;

  • запрет на агрессивное сжатие без проверки;

  • контроль прозрачности и текста;

  • использование WebP/AVIF вместе с fallback там, где это нужно.

Плохая организация:

  • запуск команды прямо по единственной папке с исходниками;

  • одинаковое качество для всех изображений;

  • отсутствие папки вывода;

  • отсутствие визуальной проверки;

  • смешивание WebP, AVIF, PNG и JPG без структуры;

  • случайные настройки, которые никто не может повторить.

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

Итоговая оценка

Squoosh CLI — сильный инструмент для командной оптимизации изображений. Он особенно полезен разработчикам и веб-специалистам, которым нужно сжимать не одну картинку, а набор файлов. Программа объединяет WebP, AVIF, MozJPEG, OxiPNG, resize, quant и rotate в одном CLI, поэтому хорошо подходит для подготовки ассетов сайта.

Главный плюс Squoosh CLI — повторяемая пакетная обработка с современными кодеками. Главный минус — отсутствие визуального интерфейса и необходимость понимать параметры. Это не программа для пользователя, который хочет просто открыть окно и нажать кнопку. Это инструмент для тех, кто готов задать команду, проверить результат и встроить оптимизацию в рабочий процесс.

Для ручной работы с одной картинкой лучше использовать Squoosh.app. Для массовой подготовки изображений в frontend-проекте Squoosh CLI выглядит значительно практичнее. Для больших production-пайплайнов его стоит сравнивать с Sharp, cwebp, avifenc, pngquant и oxipng, потому что специализированные инструменты могут быть быстрее или гибче в своей узкой задаче.

Финальный вердикт: Squoosh CLI стоит использовать, когда нужна локальная пакетная оптимизация изображений, конвертация в WebP или AVIF, сжатие JPEG через MozJPEG, аккуратная работа с PNG через OxiPNG и возможность закрепить все это в повторяемых командах. Это не универсальный редактор изображений, а точный CLI-инструмент для веб-оптимизации.