Jack of all trades concerning image optimization. Also introduces the usage of next-gen-image-formats.
Adds the possibility to optimize existing jpg, gif and png files during processing. Furthermore, it can add a webP copy of every processed image.
Use composer to add the extension:
composer require "sitegeist/image-jack"
- Completely clear all processed images via the maintenance module
- Flush Caches
- Change the server configuration (see below)
To deliver the webP images, the webserver needs to be configured properly. Example for Apache (.htaccess):
RewriteCond %{HTTP_ACCEPT} image/webp
RewriteCond %{REQUEST_FILENAME} (.*)\.(png|gif|jpe?g)$
RewriteCond %{REQUEST_FILENAME}\.webp -f
RewriteRule ^ %{REQUEST_FILENAME}\.webp [L,T=image/webp]
<IfModule mod_headers.c>
<FilesMatch "\.(png|gif|jpe?g)$">
Header append Vary Accept
</FilesMatch>
</IfModule>
As we are creating the webP images as copies (keeping the original image untouched) this configuration delivers the webP image if the client supports it. Otherwise, the original image is served.
To start the image processing a command is available:
jack:process --limit=20
The images are processed one by one. By changing the limit, the number of images to process in one run can be defined.
For the webp conversion an installed version of Imagemagick or GraphicsMagick with webp support is required.
You can check this with:
gm -version | grep -i webp
or:
convert -version | grep -i webp
When using gd, webP support is needed.
For optimizing jpg files the binary "jpegoptim" is required. You can check this with:
which jpegoptim
(Should return a path)
If missing it can be installed for example with this command:
apt install jpegoptim
For optimizing png and gif files the binary "optipng" is required. You can check this with:
which optipng
(Should return a path)
If missing it can be installed for example with this command:
apt install optipng
If enabled the images are processed live on request using a LocalImageProcessor. This can lead to high load and very long loading times upon first request (depending on the number of images on the page). It is recommended to stick with the default and use the available command for processing.
(De)activate the conversion.
Which way should be used to convert the images: Imagemagick/GraphicsMagick, GD or an external binary
Depending on the conversion type this field can be used for different purposes:
- IM/GM: Add options that are directly passed to the binary
- GD: Quality for the new images (1 - 100)
- External: The complete path to the binary to be used. You can use %s for source and target image.
(De)activate the optimization.
The path to the jpegoptim binary. Please use the complete path as is_executable
won't work correctly otherwise.
(De)activate the optimization.
The path to the optipng binary. Please use the complete path as is_executable
won't work correctly otherwise.
Just activate the levels that should be written to the log file.
The custom template should extend AbstractTemplate and implement TemplateInterface. Just use one of the existing templates as a starting point.
Custom templates can be registered like this:
$GLOBALS['TYPO3_CONF_VARS']['EXTCONF']['image_jack']['templates']['myCustomTemplate'] = \Vendor\Extension\Templates\CustomTemplate::class;
Jack will automatically pick up and run the new template if it is available for the given image type.
A log is written to var/log/typo3_image_jack_*.log
The extension settings offer the possibility to decide how verbose the logging should be.
This extension was inspired by the webp extension from plan2net.
The development and the public-releases of this package is generously sponsored by our employer https://sitegeist.de.