So I have an image tag as follows
<img src="<?= $image->thumb(['quality' => 10, 'crop' => 'center', 'blur' => 100])->url() ?>" data-src="<?= $image->thumb(['quality' => 75, 'crop' => 'center'])->url() ?>" alt="<?= $image->alt() ?>" class="c-album__img j-lazy">
When I lazy load these and look at the network tab, the supposed blurred image with a quality of 10 can sometimes be larger than the normal images with no blurring and a quality of 75. After inspection blurring doesn’t work on some of my images (seems to relate to image size).
Can someone explain the thumbs function to me? Why doesn’t it just work all the time for all images? Some of the larger images don’t get blurred at all.
If I disable lazy load so that only the src placeholder images is displayed (before it gets replaced with the full image) you can see that only 2 out of the 6 images in shot are blurred. All images run off the same loop using the same image code above.