Media uploader loads full size image and slows down, please change to thumbnails.

[mnrtjeR]

The media uploader is really slow if you upload 1024 x 768 images, the reason for this is that the preview shows full size images.

Underneath here is a quick fix to speed up the media uploader to thumbnails.
Please change line 1333 in "wp-includes/media.php" from:

$attachment_url = wp_get_attachment_url( $attachment->ID );

to:

$attachment_url = wp_get_attachment_thumb_url($attachment->ID );

[SergeyBiryukov]

Related: #23205

[ocean90]

#24754 was marked as a duplicate.

[MDesigner0]

This ticket was opened 6 months ago. With the fix being such a simple one, I'm surprised it's not in 3.5.2.

[DrewAPicture]

filter

[MDesigner0]

I hate to say it, but that patch does not work. Nor does the original ticket submitter's fix. Of course, I'm in 3.5.1, does that make a difference? That line of code is on 1333 for me, not 1604.

[DrewAPicture]

Rather than switching from one size to another (which doesn't provide any more flexibility than we already have), 23292.diff​ adds a filter to $attachment_url. More flexibility for different use cases.

For example, with the filter, something like this could be used:

function filter_prepared_attachment_size( $url, $attachment ) {
	return wp_get_attachment_thumb_url( $attachment->ID );
}
add_filter( 'wp_prepare_attachment_url', 'filter_prepared_attachment_size', 10, 2 );

Replying to MDesigner0:

I hate to say it, but that patch does not work. Nor does the original ticket submitter's fix. Of course, I'm in 3.5.1, does that make a difference? That line of code is on 1333 for me, not 1604.

Patches here are against latest trunk which is currently 3.6 RC1.

[MDesigner0]

Ah! Good to know. Hope 3.6 is out soon. If my wife's MacBook blows up from overheating, I'll never hear the end of it. ;)

[MDesigner0]

Also, on the product listing page (Woocommerce), small versions of full-size images are shown. I'm not sure if that's specific to WooCommerce, or if it's the same as a standard post listing page.

[nacin]

By default medium size images are loaded.

If images don't have medium sizes, or if the medium size is configured oddly (such as 0 x 0, to kill the size), then full will get used. The default dimensions for thumbnails are simply too small for the new UI.

I think there are some good ideas here for a future release. It is not a pressing issue at this point.

[MDesigner0]

What exactly is a "medium size" image? I've got an image that has sizes 90x90, 150x150, 158x158, 300x300, 370x370, 900x900, and 1024x1024. And the full size (2262x2261). And yet when I click "Add Media," it still uses the full 2262x2261 as the thumbnail. Doesn't make any sense.

I dunno if I'd call this "not a pressing issue." For e-commerce store owners who have large images, I think it is. This runs up the CPU usage and makes the computer run HOT. I think at least some sort of interim patch would be nice for 3.5.x.

[ocean90]

MDesigner0, take a look at wp-admin/options-media.php.

[kirasong]

Did you check to make sure that WordPress generated the smaller images for that specific upload within wp-content?

I've seen that behavior frequently when an upload fails at some point (usually due to an image being too large to be processed by the current server with its current configuration).

In that case, you'll usually end up with the Full size, since it needs to be uploaded to be resized, then as many sizes as are completed before the resizing process fails.

Replying to MDesigner0:

What exactly is a "medium size" image? I've got an image that has sizes 90x90, 150x150, 158x158, 300x300, 370x370, 900x900, and 1024x1024. And the full size (2262x2261). And yet when I click "Add Media," it still uses the full 2262x2261 as the thumbnail. Doesn't make any sense.

I dunno if I'd call this "not a pressing issue." For e-commerce store owners who have large images, I think it is. This runs up the CPU usage and makes the computer run HOT. I think at least some sort of interim patch would be nice for 3.5.x.

[MDesigner0]

Yep, all these file size variations are within the same folder in wp-content/uploads/2013/07. I believe WooCommerce generated these, as these are the various file sizes set there (150, 370, 90, 140, and 900 anyway). I also tried "regenerate thumbnails" plugin, that didn't help.

ocean90: Didn't see anything relevant in wp-admin/options-media.php.

Ok, this is helpful. As a test, I copied one of these large images and uploaded to my own WP site which doesn't have WooCommerce or a lot of plugins going on. And when clicking "Add Media" on a post, the image used is actually 300x300. So it's properly using a thumbnail, not a full size. Any ideas why my wife's WooCommerce site would not be behaving this way?

[MDesigner0]

And boom, narrowed it down. It's the theme. ARGH! Sorry for raising unnecessary red flags. :)

[creativeinfusion]

Replying to nacin:

By default medium size images are loaded.

If images don't have medium sizes, or if the medium size is configured oddly (such as 0 x 0, to kill the size), then full will get used. The default dimensions for thumbnails are simply too small for the new UI.

Maybe I'm missing something, but the default thumbnail is 150 x 150, and the default medium is 300 x 300, yet it looks like the divs these medium size images sit in all have max-height and width set to 120 from media-views.css?

[wonderboymusic]

I just watched my co-worker's computer almost melt from loading hundreds of hi-res images at once. This is due to an unbounded wp.media.query - loading 100s of hi-res images squished as thumbnails is pretty absurd.

[wonderboymusic]

#25452 was marked as a duplicate.

[leemon]

It might be a good idea to default to the "Uploaded to this post" view instead of the "All Media Items" like it is now, too.

[wonderboymusic]

When you load the modal (and you have 100s of attachments), it requests page 2 immediately after page 1, so 80 items load at once. If your full-size images are 4MB, this is loading 320MB of images at once.

If you have 100s of images, "Uploaded to this post" is a much saner default mode.

[wonderboymusic]

23292.2.diff​ sets the default library of media.view.MediaFrame.Post to the default values for the uploaded attachment filter when the user has more than one page of attachments.

Introduces wp.media.isLargeLibrary() to identify a a media library whose items are more than one page. Adds wp.media.view.settings.attachmentCounts via wp_count_attachments() in wp_enqueue_media().

As I'm thinking about how one produces content for a post, do they really need access to 80 attachments immediately every time they open the media modal?

Curious what others think...

The code is just to get this started. May need some massaging

[nacin]

Related: comment:48:ticket:24859. Maybe we should try to avoid the second call.

I'd like to see us only take special cases when we're not loading thumbnails. It might not be easy to determine, but since it's pretty edge, I'd like to not hide the library whenever anyone has more than 40 images.

We also have the upload/browse state, in terms of which one should be uploaded first. (It's supposed to remember the user's preference, though it has a bit of a glitch I think.) We could also just as easily remember if the user wants "Uploaded to this post" consistently as well.

There are a lot of minor issues here that turn into a mess when combined. Let's see what we can fix in 4.0.

[l3rady]

We remove the medium and large image sizes as we don't use them and don't want to waste disk and processing making those images sizes.

Because we do this we ran into this issue where the media would load all the highres images rather than showing the thumbnail size.

Not sure why we have to show the medium size when the thumbnail size is default 150 by 150 and the media shows the images at 120 by 120...

It would be nice just to have a filter that will allow us to see what image size name to use as a preview in the new media manager.

For the time being we are running this code to get around the issue of not having a medium image size:

	function bfdis_alter_default_image_sizes() {
		$thumbnail_dimensions = array(
			'width'  => (int) get_option( 'thumbnail_size_w' ),
			'height' => (int) get_option( 'thumbnail_size_h' ),
			'crop'   => (int) get_option( 'thumbnail_crop' )
		);

		add_image_size(
			'medium',
			apply_filters( 'bfdis_medium_width', $thumbnail_dimensions['width'] ),
			apply_filters( 'bfdis_medium_height', $thumbnail_dimensions['height'] ),
			apply_filters( 'bfdis_medium_crop', (bool) $thumbnail_dimensions['crop'] )
		);

		add_image_size(
			'large',
			apply_filters( 'bfdis_large_width', $thumbnail_dimensions['width'] ),
			apply_filters( 'bfdis_large_height', $thumbnail_dimensions['height'] ),
			apply_filters( 'bfdis_large_crop', (bool) $thumbnail_dimensions['crop'] )
		);
	}

	add_action( 'after_setup_theme', 'bfdis_alter_default_image_sizes' );

This makes the medium and large image sizes the same as the thumbnail. Because the image sizes are all the same only one size is saved to disk. The media manager now uses the size of the image set for thumbnail.

[tillkruess]

The size medium is hardcoded in imageSize() and even tho imageSize() accepts a size parameter, there is never a size passed to it, plus there is no way to pass one.

It would be awesome, if there was any way to filter the media grid thumbnail size.

https://core.trac.wordpress.org/browser/trunk/src/wp-includes/js/media-views.js#L5431

[helen]

I believe wonderboymusic fixed this in [31039], please comment/reopen if not or if I've missed a differentiating detail here.