Image resizing

[ThomasS]

Hi

I just did another performance-test prios my PHP7 upgrade and I found some devastating results. My Board-Index site is 7MB+ big and this takes ages to load of course. Main factor seems to be images, which are not resized/cropped properly. Especially the image-feed from the IPB gallery seems to take very very large pictures (1.5MB+ per image) and offers them as thumbnails.

I've seen several problems with this in the article images too... pictures are not resized properly (big & ugly resizing).

In a performance & aesthetics point of view, when is the plan to adress this problem, which carries on for quite some time now? (for example)

thanks in advance

[opentype]

I would start with using the settings. It’s up to you to set thumbnail sizes, max image sizes and also compression values for server-side image resizing. 

The linked topic is from 2013 and the request there is somewhat outdated. With responsive websites and Retina-resolution screens delivering “pixel-perfect images” gets less useful. 

[ThomasS]

55 minutes ago, opentype said:

I would start with using the settings. It’s up to you to set thumbnail sizes, max image sizes and also compression values for server-side image resizing. 

The linked topic is from 2013 and the request there is somewhat outdated. With responsive websites and Retina-resolution screens delivering “pixel-perfect images” gets less useful. 

please tell me what incorrect settings you mean

my gallery settings are:
Large: 4000x2700
Medium: 1920x1080
Small:240x240
Thumbnail:140x140

For example, the image-feed of my gallery (in the forum-index site) loads images with 1.2 Megabyte and a resolution of 870x900 per image (shown in a 264x100 window!)

Where do I have to set this correctly, that this images are resized to about 264x100, instead of pushing a Medium Sized Image into that small frame?

Also for article images, I can't find a setting for that (and my last information was, that there is no setting/resizing for that)
 

btw. I have browser caching parameters on, gzip is on, etc. - from my understanding, the software should resize the images properly to save bandwith/gain performance (like others are doing it)

 

edit: I just stumbled upon the setting 'Maximum image dimensions to display' which is set to 1000x750 (default I think). Does this play in here? What are your recommended settings?)

[opentype]

25 minutes ago, ThomasS said:

please tell me what incorrect settings you mean

I said nothing about “incorrect” settings. 

 

Quote

Also for article images, I can't find a setting for that (and my last information was, that there is no setting/resizing for that)

Not sure what you consider an “article image”. The attachments to articles use the general image upload settings. The record images, which are used as “article teaser image” have a per-database image size setting and image thumbnail setting, which can be used to make sure record listings load quickly.  Additional upload fields are just upload fields currently. They don’t have thumbnails. 

 

Quote

from my understanding, the software should resize the images properly to save bandwith/gain performance (like others are doing it)

Yes, and that’s why I pointed you to the settings. The image resizing is handled by a graphics library such as GD or ImageMagick on your server. The image quality and file size depends on what these libraries are doing and there are quality settings for it. Depending on what you set here, the same image might have 150 KB or 2 megabytes. 

[ThomasS]

3 minutes ago, opentype said:

I said nothing about “incorrect” settings. 

 

Not sure what you consider an “article image”. The attachments to articles use the general image upload settings. The record images, which are used as “article teaser image” have per-database image size and image thumbnail setting, which can be used to make sure, record listings load quickly.  Additional upload fields are just upload fields currently. They don’t have thumbnails. 

 

Yes, and that’s why I pointed you to the settings. The image resizing is handled by a graphics library such as GD or ImageMagick on your server. The image quality and file size depends on what these libraries are doing and there are quality settings for it. Depending on what you set here, the same image might have 150 KB or 2 megabytes. 

I've put all my picture size related settings in IPB into my first post (that I'm aware of) - If this could be fixed with fiddling on those settings, please give me a hint

with 'article image' I mean the image upload (first picture) which is used for the article image - If i upload a 5 Megabyte 4000x3000 image, it will clinch that 5 megabyte image into that fex hundred pixel wide window and don't do any resizing at all => horrible picture quality & file size

imho for all thumbnail pics, the pics should be resized and made smaller in size - and this is not done (nor could be done with my settings) - please correct me if I'm wrong

 

[opentype]

3 minutes ago, ThomasS said:

with 'article image' I mean the image upload (first picture) which is used for the article image - If i upload a 5 Megabyte 4000x3000 image, it will clinch that 5 megabyte image into that fex hundred pixel wide window and don't do any resizing at all => horrible picture quality & file size

These are the settings for the article record image, where you can make sure to get a small file with a size that fits your theme settings:

These are the global “image settings” which influence file size and image quality:

 

[ThomasS]

Any more feedback ?
Is this going to be looked at?
Do I need to create a ticket so it gets looked at?

[Joel R]

13 hours ago, ThomasS said:

Any more feedback ?
Is this going to be looked at?
Do I need to create a ticket so it gets looked at?

Yes, you should submit a support ticket for IPS Support to look at your specific community.  

IPS is not heavily involved in these forums.  

[ThomasS]

Opened a ticket and to be honest, I'm not really happy how this gets handled (I'm not convinced, that this is going to be looked at)

this is hurting performance and google-ranking

the screenshot shows the very large pictures, getting loaded if an gallery image-feed is implemented

are there recommended gallery-settings from the community, regarding small/medium/large settings? (as workaround)

[Joel R]

14 hours ago, ThomasS said:

Opened a ticket and to be honest, I'm not really happy how this gets handled (I'm not convinced, that this is going to be looked at)

this is hurting performance and google-ranking

the screenshot shows the very large pictures, getting loaded if an gallery image-feed is implemented

are there recommended gallery-settings from the community, regarding small/medium/large settings? (as workaround)

There's not a whole lot IPS can do if you're intentionally adding blocks of large images to your homepage.  Images are naturally going to have a larger weight on your initial loading.  Search for "image" in the ACP search box to pull up any relevant settings.  You can, for example, lower the JPG quality or reduce the image size.  

If you're the uploader of the images, you can run your images through an image optimization program like Kraken.IO, TinyPNG.com, etc.