thunder-app/thunder

"Show Full Height Images" Option squishes images

x4740N opened this issue ยท 16 comments

Bug Description

As seen below in the attached images thunder for lemmy squishes the full height images when this option is enabled

Screenshot_20240614-235335_Thunder

Screenshot_20240614-235343_Thunder

Expected Behaviour

I expect the app to show images at full height and not squish them

Steps to Reproduce

  1. Enable "Show Full Height Images" option
  2. View any post on lemmy through the app that contains an image

Additional Context

No response

App Version

v0.5.0-1

Device

Samsung Galaxy A70

OS

Android 11

I was not aware this was a bug, I thought this was the way the app handled it ๐Ÿ˜‚

I even played around with the settings but no luck, glad to see it is a bug.

I was not aware this was a bug, I thought this was the way the app handled it ๐Ÿ˜‚

I even played around with the settings but no luck, glad to see it is a bug.

I hope its a bug, I'm 90% sure it is since that doesn't look like that is the intended function of the option

It's very annoying to have to open up each image especially when I want to browse a image heavy lemmy community, it is more enjoyable to view images scrolling through them instead of opening up each one

Hello.....

Anyone going to look at this

Hey, thanks for the report! Sorry it took a bit longer to get to this one. Just a few questions:

  • Does this happen to all images within the feed when you have that option on? Or does it just affect some images?
  • Are you connected to wifi or cellular (or both) when this happens?

For some additional context into why this issue occurs:

  • Lemmy's API doesn't pass back the image's height/width information when we fetch the posts. We need this height/width information in order to determine the proper amount of "space" to allocate to the image in the feed (otherwise, scrolling through the feed makes everything jump around which is not ideal).
  • In order to work around this, we calculate each image's width/height after we get the post information. Before we do this though, we need to fetch the image itself which can sometimes take a long time (depending on the size of the image, the network, etc.). As a safe guard, we place a maximum timeout for how long we allow the image fetching to take place. If it takes too long to fetch the image, we set a default dimension size for the image (which is why you might encounter the squished images).

The good news here is that it looks like Lemmy will be adding image width/height information in a future version which should essentially fix this issue since we no longer need to fetch the image and do those calculations!

However, before that happens, the only thing we can really do is increase the amount of time allowed for the image to download. This does have a negative effect where loading the initial feed may take longer if certain images take a long time to be fetched.

I hope this makes sense and feel free to ask any follow up questions!

@hjiangsu

Does this happen to all images within the feed when you have that option on? Or does it just affect some images?

This does happen with all images

Are you connected to wifi or cellular (or both) when this happens?

I am only connected to WiFi

However, before that happens, the only thing we can really do is increase the amount of time allowed for the image to download.

Just a suggestion but what about about adding that as a user settable value for that as an advanced feature for more advanced users of the app if that already isn't an option

This does happen with all images

Interesting - this is a bug then as it should at least be able to retrieve most of the dimensions within the given timeout

Just a suggestion but what about about adding that as a user settable value for that as an advanced feature for more advanced users of the app if that already isn't an option

I can add this in as part of a debug setting for the next nightly to see if increasing the timeout value will help resolve this issue! I'm hesitant to add this in as a main setting because thumbnail metadata will eventually be included in Lemmy's API (which will most likely render this setting useless)

Just an update on this - I'm adding in a new setting in the Debug section to change the timeout value for fetching image dimensions! This should hopefully reduce the issues you're facing with images being squished.

Once this is out in a nightly build, please let me know if increasing the timeout value fixes the issues!

The option didn't help, I have it on the max 10 seconds and nothing happens

The images are still squished

Thanks for the update, and sorry to hear that the setting didn't fix anything. Could I possibly get more details to see if I can reproduce this myself?

You mentioned that you're connected to Wifi when this occurs.

  • Do you also have a VPN enabled when connected to Wifi? This shouldn't matter, but it might be useful to help reproduce the issue
  • What is your home instance, or the instance that you're seeing these issues?
  • Could you also provide the Lemmy version that your home instance is in?

Additionally, when you increase the timeout value, do you notice a large difference in the initial loading times in the feed?

Sorry about not responding for a while, I meant to respond to this but got busy and forgot

Do you also have a VPN enabled when connected to Wifi? This shouldn't matter, but it might be useful to help reproduce the issue

No I do not use a VPN

What is your home instance, or the instance that you're seeing these issues?

lemm.ee

Could you also provide the Lemmy version that your home instance is in?

BE: 0.19.5

Additionally, when you increase the timeout value, do you notice a large difference in the initial loading times in the feed?

No, it is 2-3 seconds When I increase the timeout value and does not change

I have the same problem using the lemm.ee instance. If I use another instance it works has intended.
But using full height images in voyager and in eternity, lemm.ee works without problems.

Thanks for the responses! I believe I narrowed it down now. It seems like lemm.ee is using image proxying to handle images, which Thunder was not handling properly.

I'll push out a fix for this in the next general release!

Just an update - I've pushed out a new nightly build (v0.5.0-6) which should address this issue. Please let me know if this fixes the problem!

V0.5.0-6 fixed it for me.

Thanks for the fix and your work @hjiangsu .