Easy IO (ExactDN) for Plugin and Theme Developers

If you are wanting to make your plugin work better with the Easy Image Optimizer, it helps to understand how it works. So here is a list of things that our plugin looks for:

1. It looks for height/width attributes on any img elements that it finds, and will resize an image to those dimensions.
2. It checks the $content_width global variable, which is normally set by the theme, and scales images to that width.
3. It will also look at the attachment ID and size names that might be inserted as classes or other attributes and makes sure the image is not too large.
4. Easy IO filters the image_downsize() function to produce an image that is exactly the size you need. I'll show some practical tips of how this works in a minute.
5. And lastly, it filters the built-in srcset functions for WordPress to fill in any gaps that might exist for mobile devices and varying screen sizes. It uses multiples of .2x, .4x, .6x, .8x, 2x, and 3x by default, but you can override that and add your own if you like.

image_downsize()

You've likely never used or seen the image_downsize() function directly, but it is used by these functions: get_image_tag(), wp_get_attachment_image_src(), wp_get_attachment_thumb_url(), wp_get_attachment_image_url(). If you visit the developer reference for any of these functions, you'll see that they are, in turn, used by other core functions, many of which have a size parameter available.

The size parameter is where the magic happens, but you have to use it correctly to get the best results, because it can be given either the name of an existing size, or a desired height/width combination. If you just pass along a size name, like 'thumbnail', or 'full', you'll get what you asked for. But if you pass along the exact dimensions you need, like array( 800, 600 ), then you'll get that exact image size from Easy IO.

Similarly, the wp_get_attachment_image_srcset() function mentioned in #5 above has a size parameter that works exactly the same. But in this case, Easy IO has some wiggle room. So if you pass along 'medium', it will give you that size + the above mentioned multiples, and any existing sizes that are smaller than the requested size.

aq_resize()

If you use aq_resize() in your code, you need to be careful to check the return value, because it's highly likely that Easy IO will already have altered the url before it gets to aq_resize(), and then aq_resize() will give you a big fat nothing in response. Apparently, it's an intended design in aq_resize(), so you need to check to see that aq_resize() has returned a valid url, and use the original url if it doesn't. Of course, now that you know about Easy IO, you can get the same effect without placing any strain on the web server and with increased performance!

Images in CSS

Our plugins support parsing of CSS background-images directly on div, span, li (list item), section, and a (link) elements. If you put your CSS in a separate block, either in the HTML head or in a separate CSS file, we cannot do automatic image scaling or lazy load. The plugin will still try to compress images if the CSS code is included directly in a style block in the page, but using style attributes directly on an element is going to yield the best performance.

Third-party Filters

You may have your own filters to wrangle image URLs in your code, and we welcome any requests for direct integration. If you would like to rewrite a URL directly in your own code, you can use this code snippet (with a given $url, $width, and $height):

global $exactdn;
if ( is_object( $exactdn ) && method_exists( $exactdn, 'get_exactdn_domain' ) && $exactdn->get_exactdn_domain() ) {
	$args  = array(
		'resize' => "$width,$height",
	);
	$url = $exactdn->generate_url( $url, $args );
}

Alternatively, you can implement the ExactDN API directly in your code if you like. If you simply want to rewrite an image URL from local to the CDN, you can use the built-in filter like this:

$cdn_url = apply_filters( 'exactdn_local_to_cdn_url', $local_url );

If you think of anything I've missed, or have additional questions, just use the contact form and I'll be happy to help you out.