Page MenuHomePhabricator

MediaViewer downloads high-res image twice if thumb URL is re-used
Closed, ResolvedPublic

Description

Follows-up T422586: MediaViewer downloads high-res image twice if original is a medium-size JPEG.

It still downloads images twice when the thumb size ends up used as the high-res version (i.e. mobile screen, narrow desktop window, or if original is not very big).

I narrowed down the cause to a difference in CORS mode, as indicated here by Sec-Fetch-Mode: cors and Sec-Fetch-Mode: no-cors differing.

Prod
Screenshot 2026-05-13 at 17.09.58.png (1,424×1,706 px, 517 KB)
Screenshot 2026-05-13 at 17.09.56.png (1,424×1,706 px, 520 KB)
Local
Screenshot 2026-05-13 at 17.10.02.png (2,440×1,700 px, 751 KB)
Screenshot 2026-05-13 at 17.10.01.png (2,440×1,700 px, 751 KB)

This is implemented in mmv.provider.Image.js as follows:

	rawGet( url, cors ) {
		const img = new window.Image();

		// This attribute is necessary in Firefox, which needs it for the image request after
		// the XHR to hit the cache by being a proper CORS request.
		if ( cors ) {
			img.crossOrigin = 'anonymous';
		}

I'm guessing this was created with an expectation that it is uncommon for a thumbnail to be suitable as the high-res preview. And so the fact that enabling CORS prevents re-use of browser cache for a regular <img> without this attribute (such as the thumbnail we clicked), was probably considered unimportant and worth the compromise in order to get the XHR feature working.

This XHR feature existed in order to get xhr.onprogress events to use for a progress bar. @simon04 recently mentioned this wasn't used in practice, because we dispay the low-res image as placeholder instead of a progress bar. The remnant code for this was removed in change 1281972.

So.. we if we get rid of this condition, we should be able to enjoy full cache re-use.

Event Timeline

Change #1281824 had a related patch set uploaded (by Simon04; author: Simon04):

[mediawiki/extensions/MultimediaViewer@master] Replace large image loading via ImageProvider with simply setting HTMLImageElement.src

https://gerrit.wikimedia.org/r/1281824

Change #1281824 merged by jenkins-bot:

[mediawiki/extensions/MultimediaViewer@master] Replace large image loading via ImageProvider with simply setting HTMLImageElement.src

https://gerrit.wikimedia.org/r/1281824

@KockaAdmiralac Thanks, I've closed the first three. I believe the last two are not related.

This XHR feature existed in order to get xhr.onprogress events to use for a progress bar.

And for collecting performance metrics (I forgot the details but maybe CORS was needed for accessing some of the ResourceTiming data?) which IIRC also have been removed (at the very least, no one looks at them).