Optimizt is a command-line tool that helps prepare images for the web.
It can compress PNG, JPEG, GIF, and SVG lossy or lossless, and create AVIF and WebP versions for raster images.
As frontend developers, we have to care about pictures: compress PNG and JPEG, remove useless parts of SVG, create AVIF and WebP for modern browsers, and so on. One day, we got tired of using a bunch of apps for that, and created one tool that does everything we want.
Install:
npm install -g @343dev/optimizt
Optimize!
optimizt path/to/picture.jpg
--avif
— create AVIF versions of images.--webp
— create WebP versions of images.-f, --force
— recreate AVIF and WebP versions even if they already exist.-l, --lossless
— optimize losslessly instead of lossily.-v, --verbose
— show detailed output (e.g. skipped files).-c, --config
— use a custom configuration file instead of the default.-o, --output
— write results to the specified directory.-V, --version
— display the tool version.-h, --help
— show help message.
# optimize a single image
optimizt path/to/picture.jpg
# optimize multiple images losslessly
optimizt --lossless path/to/picture.jpg path/to/another/picture.png
# recursively create AVIF and WebP versions for all images in a directory
optimizt --avif --webp path/to/directory
# recursively optimize JPEG files in the current directory
find . -iname \*.jpg -exec optimizt {} +
Provides the best balance between file size reduction and minimal visual quality loss.
- AVIF/WebP: Uses lossless compression.
- PNG/JPEG/GIF: Maximizes image quality at the expense of larger file sizes.
- SVG: Settings are identical in both modes.
Image processing leverages:
Note
In Lossless mode for JPEG, Guetzli is used. Repeated optimization may degrade visual quality.
Default settings are defined in .optimiztrc.cjs, which includes all supported parameters. Disable any parameter by setting it to false
.
When using --config path/to/.optimiztrc.cjs
, the specified configuration file will be used. If no --config
is provided, Optimizt searches recursively from the current directory upward for .optimiztrc.cjs
. If none is found, defaults are applied.
Ensure the ignore-scripts npm option is disabled. Details: funbox/optimizt/issues/9.
# pull latest
docker pull 343dev/optimizt
# pull specific version
docker pull 343dev/optimizt:9.0.2
# clone repository
git clone https://github.com/343dev/optimizt.git
cd optimizt
# build image
docker build --tag 343dev/optimizt .
Alternatively:
# build directly from GitHub
# ignores .dockerignore (see: https://github.com/docker/cli/issues/2827)
docker build --tag 343dev/optimizt https://github.com/343dev/optimizt.git
# mount current directory to /src in the container
docker run --rm --volume $(pwd):/src 343dev/optimizt --webp ./image.png
Optimizt works seamlessly with:
Cute picture for the project was made by Igor Garybaldi.