PHP自动将图像转换为数据URI

Question

I have several high-resolution images that I am using on my website. I am using PHP to echo the images. I specify a width of "30" for each of the images, which correctly sizes them.

The problem is that for SOME of the images, there is some sort of automatic conversion to data URI - which seems to cause the images to not only be resized to 30x30, but also to have a resolution of 30x30.

This seems to happen when I refresh - almost like it is caching the php after the first execution, then on refresh, it thinks the image file size is actually 30x30.

See images below - the first image is the first time I visit the website and screen captured on my iphone. Then I refresh, and the second screenshot is the result. Notice that the apple image remains crisp on both, while the rest appear blurry. All of the original files have approximately the same resolution.

Additionally, if I view the apple image (after refresh) in it's own window, it shows this:

.../logos/30xNx50de0713c94d847...

Whereas if I view the "dicks sporting goods" image in it's own window, it shows this:

data:image/jpeg;base64...

I am not specifying any kind of data URI conversion - would it be something on the server that does this automatically? And why for some images but not others?

Thank you for your time.

Answer 1

I determined this was a result of PageSpeed being enabled on my host. PageSpeed is a Google product that optimizes the loading of pages - and in this case, transforms images based on the width that is specified in the img tag.

By adding

?ModPagespeed=off

to the end of any page, it disables PageSpeed and shows the images at full resolution. I took this approach rather than disabling PageSpeed entirely, because I want some of my pages to take advantage of the optimization.