Automatically create & optimize responsive image transforms, using either native Craft transforms or a service like Imgix, with zero template changes.
.imgTag()
to the OptimizedImage
model, which generates a complete <img>
tag from the OptimizedImage
.pictureTag()
to the OptimizedImage
model, which generates a complete <picture>
tag from the OptimizedImage
.linkPreloadTag()
to the OptimizedImage
model, which generates a complete <link rel="preload">
tag from the OptimizedImage
craft.imageOptimize.renderLazySizesJs()
to render the LazySizes JavaScript for lazy loading imagescraft.imageOptimize.renderLazySizesFallbackJs()
to render the LazySizes JavaScript with a support script that uses LazySizes as a fallback for browsers that don't support the loading
property--queue
option to the image-optimize/optimize/create
console command if you want to defer the image generation to be run via queue job, rather than immediately via the console commandphpstan
and ecs
code lintingcode-analysis.yaml
GitHub action.imgTag()
to the OptimizedImage
model, which generates a complete <img>
tag from the OptimizedImage
.pictureTag()
to the OptimizedImage
model, which generates a complete <picture>
tag from the OptimizedImage
.linkPreloadTag()
to the OptimizedImage
model, which generates a complete <link rel="preload">
tag from the OptimizedImage
craft.imageOptimize.renderLazySizesJs()
to render the LazySizes JavaScript for lazy loading imagescraft.imageOptimize.renderLazySizesFallbackJs()
to render the LazySizes JavaScript with a support script that uses LazySizes as a fallback for browsers that don't support the loading
property^5.0.0
& Node ^20.0.0
for the buildchain--queue
option to the image-optimize/optimize/create
console command if you want to defer the image generation to be run via queue job, rather than immediately via the console commandphpstan
and ecs
code lintingcode-analysis.yaml
GitHub action.imgTag()
to the OptimizedImage
model, which generates a complete <img>
tag from the OptimizedImage
.pictureTag()
to the OptimizedImage
model, which generates a complete <picture>
tag from the OptimizedImage
.linkPreloadTag()
to the OptimizedImage
model, which generates a complete <link rel="preload">
tag from the OptimizedImage
craft.imageOptimize.renderLazySizesJs()
to render the LazySizes JavaScript for lazy loading imagescraft.imageOptimize.renderLazySizesFallbackJs()
to render the LazySizes JavaScript with a support script that uses LazySizes as a fallback for browsers that don't support the loading
property^5.0.0
& Node ^20.0.0
for the buildchain