[Enhancement/Question] Control thumbnail resolution

[jamesdrake101]

Is your enhancement request related to a problem? Please describe.
The thumbnails on (my otherwise very functional and beautiful) Invidious web UI look like low-resolution 60% quality compressed JPEGs blown out.

Describe the solution you'd like
Control thumbnail resolution and quality. The same thumbnails look amazing on Yattee.

Describe alternatives you've considered
I have searched extensively for "thumbnail quality" and "thumbnail resolution" before opening this issue.

[Fijxu]

Can you provide an URL of the thumbnail that you get on Invidious and the URL that you get on yatte? (If that is even possible)

That may change with https://github.com/iv-org/invidious/pull/5184/commits. But I'm not sure.

(Do not test with my instance at inv.nadeko.net since the pull request that I linked above has been already applied there, try with a private instance hosted by you if possible)

[jamesdrake101]

Thanks for the reply and for this amazing project in general.

The thumbnails on your instance look terrible, like mine.

I'll dig out the URLs when I am at my computer.

[jamesdrake101]

So this is the URL of a thumbnail as generated by the web UI of my private instance: /vi/wdx8AfiXOkE/mqdefault.jpg

Whereas this is what Yattee requests: /vi/wdx8AfiXOkE/maxresdefault.jpg

maxresdefault.jpg is beautiful, mqdefault.jpg is trash.

Thanks @Fijxu :)

[Fijxu]

Well, that seems to be a design that Yatte developers made since yatte also works for tvOS, so it makes sense to serve a bigger thumbnail there for big screens. Invidious web uses mqdefault.jpg because there is no need to serve a bigger thumbnail if the size of them is going to be fixed size.

An option could be added on preferences, but I don't think that is going to happen in this repository of Invidious. That's just my opinion so wait for an official response from the maintainers.

[jamesdrake101]

I am happy to do the PR myself. :) mqdefault.jpg looks really like trash on my PC screen, and frankly saving thumbnail bandwidth on a web service with gigabytes of video content is not all that critical.

[unixfox]

I prefer to keep the page as lightweight as possible so the default thumbnails will be kept.

I think that's the same size of thumbnail as youtube.com so we are on part with them.

IMO we shouldn't have preferences options for every possible customizable things. This complexify the maintenance.

@SamantazFox @syeopite what do you think?

[jamesdrake101]

That's fair enough, however the thumbnails hardly look so terrible on YouTube, they look fine to be honest.

If you don't want to add a UI element, at least a constant buried somewhere in a config file would be nice.

So I don't have to fork the project to fix the thumbnails, really.

[unixfox]

they look fine to be honest.

What's the url for youtube then?

[jamesdrake101]

YouTube is loading maxresdefault.webp for all video thumbnails, at least on my browser, and the grid looks like a normal webpage from 2025. The otherwise beautiful and functional Invidious web UI loads these trash thumbnails from hell instead.
I don't even need a UI element, if you guys decide to expose a constant in a config file I can manage.

[syeopite]

I'll personally be for adding a setting to adjust thumbnail qualities but not total granular control on all the resolutions YouTube offers. Just something like "low, medium, high" for the options.

The structure for storing thumbnails does need a refactor too. We should be storing links to all the possible thumbnails returned by YouTube instead of just hard coding the lowest resolution here.

invidious/src/invidious/yt_backend/extractors.cr

Lines 958 to 960 in 164d764

	def self.get_thumbnails(container : JSON::Any) : String
	return container.dig("thumbnail", "thumbnails", 0, "url").as_s
	end

The implementation on the frontend for thumbnail quality selection can then just be getting the thumbnail url at the 0 or -1 positions from the array.

This will be a breaking change on the API side of things though, so we might need to provide a new field for it.

[jamesdrake101]

Any testing or assorted monkey work you need give me a shout.

Meanwhile, as a stopgap, I'll probably Greasemonkey the website - which is easier than forking invidious.