Not working 100%

Hello, Stephen,

I am sorry for my tardy reply, but I was preoccupied at the latest WordCamp Europe in Belgrade. I do appreciate your feedback, though!

I guess the explanation about the cache folders is that most probably the plugin did not detect that any other image sizes were actually requested. Perhaps this is because you accessed the website by a retina display and you have both the HiDPI support and Bigger dimension settings enabled in the Adaptive Images plugin settings page. These settings combined lead to larger images being served, which sometimes are equal to the original ones. So, in these case, no resized images are created and the original images are actually served, because they are already available!

Right now I see that the plugin is probably disabled, so I cannot do any debugging on your website. Perhaps you could enable it for me, so that I can take a look and see how the images are resized.

Cheers,
Takis

Hi Takis

Yes I was wondering where you were! I hope the event was a good one for you ??

I was doing some testing last night which involved removing the plugin, my apologies. I have reinstalled the plugin and it says that it is working correctly in the dashboard.

I have followed your video tutorial and have setup a 360×640 mobile screen in Chrome to test. The cookie tells me 640,3. It appears the cookie looks at the depth, rather than the width? Is this correct?

I take your point that viewing this page on retina screens may not invoke a lower res image to be called. Thanks for the heads up with this. Even so, a 1360×720 image loaded via an 720×1280 iphone 5 I would have thought would produce a 1024 or 720 image according to my breakpoints?

After reinstalling the plugin, I have loaded this page: https://www.scenicgems.com/australia/attractions/hunter-valley-2 at the 360×640 (chrome) size, but there are no images being generated currently in the adaptive-images cache folder.

As mentioned, the plugin has worked somewhat in the past, perhaps it was working completely, but at present something needs attention?

Thank you so much for any assistance Takis.

Note: I have cloudflare, siteground cache plugin and autoptimize installed.

Cheers, Steve

Hello, Steve,

OK, now I have a number of observations to make, so bear with me!

1. A 1360×720 image loaded via an 720×1280 iPhone will produce an 720 pixel image if you have the Bigger dimension property in the Adaptive Images plugin settings page turned off, but it will produce a 1280 pixel image if the Bigger dimension property is turned on. That is what this property does, it takes into account the landscape (bigger) dimension of the device!

However, when the HiDPI property is turned on, then you will have to multiply the above by the size of the device pixel ratio. So even a small 360 pixel iPhone with a device pixel ration of 3 causes the need for 3*360=1080 pixel wide images to be requested from the Adaptive Images plugins.

I understand that it gets a bit complicated once these properties are taken into account and activated, but we have tried to provide for all possible combinations that might occur.

2. The plugin seems to work quite nicely in your website and I can see this by directly acessing any of your images like this https://www.scenicgems.com/wp-content/uploads/2017/06/wine-hunter-valley-landscape-nsw_1360x720.jpg?resolution=360,1 or like this https://www.scenicgems.com/wp-content/uploads/2017/06/wine-hunter-valley-landscape-nsw_1360x720.jpg?debug=true. Please, note the debugging parameters at the end of these urls.

However:

3. I did notice that your content is being delivered with Cloudflare headers, which means that you are probably using their CDN! This point has nothing to do with the above, but CDNs are a different case dor us. Unfortunately it is the way they work that makes it really hard to cooperate with the Adaptive Images plugin smoothly.

We have a special CDN support option which we mention is experimental. You may want to try and use it. It shoudn’t break anything but it has a few shortcomings: a) it cannot detect images in CSS backgrounds b) it allows some images to be delivered non-resized and c) there some CDN setups that are totally incompatible with it.

I would really like to hear your thoughts on the above and perhaps tell me if the CDN support feature has made any difference after you activated it.

Cheers,
Takis

Hi Takis,

Thankyou for your detailed answer, it has cleared things up considerably.

In light of your comments, I have turned HiDpi support OFF and turned bigger dimension ON. I am quite happy with the result of this, as it serves slighty higher resolution files to ‘portrait’ screens thanks to bigger dimension. If a user is on a retina device, they will see the benefit of this larger size when viewed in portrait mode. The page load is now acceptable, and the images are a good balance of weight/detail. Thank your for explaining!

It now works acceptably, so unless there is a reason to enable CDN support, I will most likely leave this turned off in light of the drawbacks you mention.

On another note, looking at this page again:

https://www.scenicgems.com/australia/attractions/hunter-valley-2

… you will notice 7 images all grouped together near the top of the page. These small images are not being resized by the Adaptive Images Plugin. I understand why they aren’t being resized, as the plugin works off the viewport size, not individual image dimensions.

Do you feel that it is possible for a developer to add functionality to the plugin, to do the following (excuse my non code speak):

If cookie value of viewport = < 640,
resize and swap out 545x363px images for (a smaller image dimension)
resize and swap out 363x242px images for (a smaller image dimension)

I ask this, as I am also working on a google map with about 450 thumbnail images to load. If I could hook into the Adaptive images plugin to serve lighter thumbnails, my goal of mobile greatness will be one step closer ?? If you had any advice to pass onto a developer for the above it would be most welcome.

Thankyou again Takis, this would have to be one of my favourite plugins for WordPress. I cannot tell you how much time and effort this little packet of goodness has saved me.

Thanks
Steve

Hello, Steve,

Thank you very much for your kind words!

About the 7 images, the reason they might seem not being resized is either a) the fact that they are already small enough, if combined with the Adaptive Images settings that we discussed above and the device dimensions that you test it in, or b) perhaps it is the CDN which has cached these image sizes and serves them.

Now I wouldn’t want to spoil a recipe that already works nicely for you, but if you are indeed using a CDN (and still have the patience to test things out) then you should try the CDN support feature. Otherwise, just keep things the way they are and be happy about it!

Lastly, on the 450 images subject, I guess your real problem there is the total number of images and their individual sizes. I mean you obviously can get some benefit by optimising each and every image, but your main bottleneck will be the number of image requests the browser will need to make almost simultaneously in order to download them all.

Hope this helps!

Cheers,
Takis

Hi Takis,

Ok I have tried the CDN feature and I can confirm that it is replacing out the same images that the plugin was before. You have spoken of the known disadvantages of using this feature, can I ask, what are the advantages?

Thanks
Steve

Hello, Steve,

This feature has some drawbacks due to the way CDNs work. Of course the way CDNs work is why we use them anyway! ??

So, the thing is that when used with a CDN and with this feature enabled our plugin may fail to deliver the resized version of an image and thus deliver its original size. This may happen with *some” of the regular HTML images, although probably very-very few of them and it may happen with some of the images in CSS backgrounds. The reasons are different in each case.

The good thing is that nothing will break, but the effectiveness of the plugin will not reach its potential to a 100%.

Aaand we are still working on it!

Cheers,
Takis

Hi Takis,

Well a few images served at 100% sounds better than not at all. I will leave this function on and see how it goes.

Thank you for all your time and help, truly appreciated. All the best with future plans to improve what is already a fantastic plugin.

Cheers,
Steve

Hi, Steve,

You are very-very welcome!

Cheers,
Takis