[SOLVED] How to prevent users from uploading 300 dpi images?

[howdytom]

How can I globally limit the max. dpi image size in ProcessWire? I have set max width and height for uploaded images and I also added a description with additional information. The image field is cropped and scaled in various sizes. However the image dpi remains untouched. Some users still managed to upload large 300dpi images, which causes massive server CPU spikes on every page reload. I tried to teach those users, but they simply don't care. 300dpi images should not be uploaded to PW in the first place.

What is the best option to prevent users from uploading 300dpi images? What is your recommendation?

[taotoo]

Dpi normally shouldn't matter. Are the problem images' px dimensions larger than the limits you have set?

If using server side resize you could try client side.

[howdytom]

You are right. 72dpi or 96dpi files do not matter. I do not see any difference choosing between client-or server-side resize. I am using a max width and height dimension. PW scales and compresses the original image from 7MB to 916KB. However the dpi a remains untouched. 300 dpi images cause bigger file size, bigger network payload with long load times. The CPU usage is noticeable higher instead of using 72/96 dpi files.

[bernhard]

Hey @howdytom I might be wrong, but I think that you misunderstand the concept of DPI on images on the web. This is a good blog post to read: https://daraskolnick.com/image-dpi-web/

So as far as I understand DPI should really not matter at all on the web. All that matters are the pixel dimensions of the image. More pixels --> bigger file size. Less pixels --> smaller file size.

1 hour ago, howdytom said:

PW scales and compresses the original image from 7MB to 916KB. However the dpi a remains untouched. 300 dpi images cause bigger file size, bigger network payload with long load times. The CPU usage is noticeable higher instead of using 72/96 dpi files.

I think that this statements are wrong. I tried to prove that using affinity photo but it doesn't even offer a DPI setting for exporting JPG images. You only get a DPI setting if you export a PDF, which makes sense, because there the DPI define the size of the image when printed and there it makes a huge difference if you print 1000 pixels ad 72dpi or 300dpi 🙂 

[Jan Romero]

52 minutes ago, bernhard said:

I tried to prove that using affinity photo but it doesn't even offer a DPI setting for exporting JPG images.

You can change the dpi in Document -> Resize Document by unchecking “Resample”, i.e. you’re just changing how big the image should appear on physical media but not its pixel dimensions:

 

For example here’s a 300px by 300px picture of a salad. Both images are exactly the same, but if you import them into a DTP software like Affinity Publisher, InDesign or Scribus, by default one will be 8cm (96 dpi) and one will be 2.5cm (300 dpi). That is to say you’re correct and dpi don’t matter in terms of file size or pixel resolution on the web.

[bernhard]

46 minutes ago, Jan Romero said:

Thx @Jan Romero and both images have 25,7kB which is exactly what I tried to show 🙂 

[howdytom]

@taotoo, @bernhard, @Jan Romero Thanks for your clarification. Regarding 300dpi file size I was wrong. 

I did experience this kind of slowness and high CPU usage with a client project that I recently migrated. It turned out the previous owner did not define any image scaling. They used to export 300dpi files from Indesign with 20MB file sizes and users uploaded multiple images to the ProcessWire project. Approx. 100MB were loaded on every page refresh. After taking a closer look I managed to resolve the issue.

Thanks again.