Hotlinked Images Frequently Get Stretched To Unnatural Dimensions

  • Dear support,

    I run an Amazon affiliate website where I load images from Amazon’s API, for multiple product reviews on the same page.

    I have pages with dozens of such image loads.

    On the AMP pages, some images get stretched to unnatural 1000 pixel widths.

    Observations:

    1. This only happens when my site is running on its production server, but not when the site is running on my localhost.

    2. All images have similar img tag code. Upon AMP page reload, it’s always the same images that get stretched, and the same ones that don’t. It seems to be deterministic, even though you’d expect it to be random (since all images have similar html).

    My suspicion is that it has something to do with deferred image loading. Your AMP pages are unable to correctly determine a hotlinked image’s width, and therefore go for the default of 1000px.

    Hardcoding an image width on my images in my HTML pages did not resolve this problem. It gave the image the right width, but not the right height. And I do not know the correct height upfront, since the image is hotlinked. So the AMP page computes an aspect-ratio incorrect height, and the image appears too small.

    In SEO, it’s custom to keep your websites to yourself, so I am hesitant to share my problematic AMP page here.

    Can you (support) give me an email so that I can send an example of image widths going wrong?

    Sincerely,

    Jay

Viewing 10 replies - 16 through 25 (of 25 total)
  • Thread Starter Jay

    (@jwbats)

    The whole idea of FasterImages is that you can retrieve the dimensions without having to retrieve all of the images.

    Seems to me there’s a bug in this code. Maybe when retrieving small images, it decides it doesn’t have enough data to go on, then refuses to look at the image’s dimensions.

    It’s gotta be somewhere in that direction.

    Thread Starter Jay

    (@jwbats)

    I’ve found a fix.

    I figured out you guys use transients. Installed a transient cleaner to force amp4wp to re-request all the images, so I could debug better.

    Setting the $mode variable from ‘concurrent’ to ‘synchronous’, after cleaning the transients, solves my problem, because image dimension requests will rely on fast_image rather than faster_images.

    In my view, faster_images isn’t a whole lot faster than fast_images. And since you’re caching transients anyway, every subsequent amp-page request is gonna be pretty fast.

    An easy way for you to fix this problem is to make either the $mode an user configuration. Or maybe let the user choose between fast_image and faster_image.

    It would also help to let your users clean the transients. And force a transient cleaning when the user switches his image retrieval settings, otherwise it will lead to confusion.

    Ofcourse it would be even better to just debug and fix faster_image, but that will take longer.

    Anyway, please include image dimension retrieval options in your plugin. I can edit the code manually, but it will be overridden the next time I update. And you guys have a lot of updates.

    Thread Starter Jay

    (@jwbats)

    @ahmedkaludi

    Is somebody still paying attention to this thread?

    I found a fix. See my previous post.

    Plugin Contributor ampforwp

    (@ampforwp)

    Hi @jwbats
    I just send you the message on your email.

    • This reply was modified 7 years ago by ampforwp.
    Thread Starter Jay

    (@jwbats)

    I got the email. It requested information that is already elaborately described in my submitted ticket as well as in this thread. I replied pointing this out.

    Plugin Author Ahmed Kaludi

    (@ahmedkaludi)

    Sure @jwbats

    Let’s continue the conversation over the email only.

    Plugin Author Mohammed Kaludi

    (@mohammed_kaludi)

    Hey @jwbats,

    We have created a filter on your request called ‘amp_fetch_image_mode_type’.

    By using this you will be able to change the mode according to your needs.

    Ref: https://github.com/ahmedkaludi/accelerated-mobile-pages/commit/5e0d252b5f0e16e0d93bc31123feecf1b95f27b2

    Thread Starter Jay

    (@jwbats)

    Hey @mohammed_kaludi,

    Thanks, but I can’t find where to configure this setting in the plugin’s setting page?

    I’ve asked this question via mail/github many times, but am not getting a response.

    We’re close to a solution. I only need to know how to configure the image fetch mode.

    Sincerely,

    Jay

    • This reply was modified 7 years ago by Jay.
    Plugin Author Ahmed Kaludi

    (@ahmedkaludi)

    Hi @jwbats

    Yes, we tried discussing internally but we’re unable to understand how to re-create the issue.

    Thread Starter Jay

    (@jwbats)

    Hi @ahmedkaludi,

    You’ve recreated this issue successfully and also came up with a fix for it: issue 1833 on github.

    I want to be able to set my image fetch mode to ‘synchronous’ or ‘concurrent’, because setting it to ‘synchronous’ fixes an issue for me.

    The idea behind your ‘amp_fetch_image_mode_type’ filter is that I can use it somehow, isn’t it?

    How do I make use of this ‘filter’? How can I manually set the image fetch mode to ‘synchronous’ in order to fix my image problem?

    Where does this setting exist in your plugin’s interface???

    Sincerely,

    Jay

Viewing 10 replies - 16 through 25 (of 25 total)
  • The topic ‘Hotlinked Images Frequently Get Stretched To Unnatural Dimensions’ is closed to new replies.
  • In: Plugins
  • 25 replies
  • 4 participants
  • Last reply from: Jay
  • Last activity: 7 years ago
  • Status: not resolved