Image assets pixelated on frontend after Kirby update

Hi,

I’ve recently cloned a site to test and update to Kirby CMS 3.9, however, after I deleted the media folder the recreated folder now serves pixelated images.

Example of how images should look.

Example of how they currently look

Can anyone provide any insight please?

@texnixe @lukasbestle do you know anyone who has experienced this issue?

Thanks in advance.

Never seen this happening. Is the update the only thing you changed (from which version)? Or did you also update the server?

Hi, no I cloned to the same server. It’s a Digital Ocean droplet, PHP 8, updated from Kirby 3.7.4 to Kirby 3.9.

This is the same for all images on the site.

I followed the same routine, replace the Kirby folder and delete the media folder.

If I delete the media folder again will it regenerate again?

Yes, sure.

OK will give that a go and report back - maybe it was a glitch in the matrix.

@texnixe I deleted the media folder but the problem persists.

Can I replace it with the media folder from the origin site it was cloned from or will that not work?

Thanks

The media folder is automatically recreated. It is not necessary to upload a version from the archive.

Thanks, but the media folder is regenerating the same pixelated assets. If the issue is not with the media folder I need to determine where the issue is originating.

Is the generated image a low resolution image “upscaled” to fit the screen or is the image actually high resolution with those artefacts?

The rendered and intrinsic size of the images has remained the same as the origin site, however, the file size of the original image is 157kb vs the pixelated version which is 7kb, so I wonder what might be causing that across the board?

How are the images rendered? Do you make use of any config settings which might be different per domain (thumb settings, thumb driver)?

Can you post a link to the test site?

I don’t think I am.

Sure here is the url - thank you.

I had this issue before. Iirc I could only fix it by switching the thumb driver to IM.

That doesn’t answer all my questions from above…

Please post the relevant thumb config settings from all of your config files. And the code to render the thumbs. The size of the original images might be interesting as well.

I don’t really think this is an issue with the Kirby update, but rather some Kirby configuration or server config issue.

I don’t actually have any specified in my config file. Sorry, I inherited this site from a former developer. Any tips on where I might find these if not in the config.php?

When I had this issue this even happened with the panel thumbnails. So I think this might rather depend on a server config issue, maybe clashing with specific image metadata (as it was not happening with all images in my case). Size of the images was nothing extra-ordinary, like 1-2 MB in file size.

Thanks - will take a look at the server config, strange thing is it’s on the same server as the origin site.

It doesn’t seem to affect all images:

Past edits

This seems to suggest that there’s something unusual with some images.

Could you share one of the original files that gets messed up? I guess it would help being able to replicate the issue, or at least being able to exclude them as the source of the problem. Maybe GDLib has some trouble reading those files.

edit: nvm: found one: https://phpstack-585419-3921990.cloudwaysapps.com/media/pages/work/the-creator/cc38197584-1695802852/thecreatorposter2.jpeg

edit2: yeah, so… actually the ones that aren’t pixelated are in png format… So my guess is that for some reason the thumbnail driver is receiving a 'quality' => 0 (or similar) setting for some reason (this obviously doesn’t affect the PNG images).

edit3: I’ve done some tests, and setting 'quality' => 0 does have the same effect on the images as the one we see on your site. What’s strange, though, is that normally such a setting would be reflected in the filename of the produced thumbnail (with a -q0 suffix), and your images don’t have that. There’s definitely something fishy going on.

edit4:

… unless the setting is specified in the config.
Are you really sure you’re not specifying anything about thumbs in the config files? (config.php, env.php, etc?). I mean, a config like this creates pixelated images:

<?php 
return [
    'thumbs' => [
        'quality' => true // will be typecast to 1 (out of 100)
    ]
];

edit5: A few tests later. What changed between 3.7.4 and 3.9 is that a config like:

'quality' => null 

was ignored in Kirby 3.7, but gets interpreted as 'quality' => 0 in 3.9. That would explain stuff.
Given the circumstances I’d point my finger there.

If you really don’t have anything in your config files, maybe there’s a plugin which does something to the config. What plugins do you have installed?

Thank you for taking the time to take a comprehensive look and for your explanations.

So in the absence of thumb config settings, the only place I can see image settings being specified is within templates

e.g. 'image' => $project->listingimage()->toFile()->resize(800)->url()

I don’t have a lot of plugins installed - markdown-field, xmlsitemap, retour, readingtime, cookiebanner

If I add something like:

    'thumbs' => [
	  'quality' => 100
    ],

to my config file - is there anything I need to do to regenerate the thumbs?

Thanks!