Adaptive Image Compression
This service is being discontinued
Akamai will discontinue Adaptive Image Compression on May 31, 2024.
As an alternative, we offer Image & Video Manager. It intelligently and automatically optimizes images and videos on the fly for every user. It's easy to deploy and requires no changes to your original code, files, servers, or processes.
Adaptive Image Compression (AIC) increases compression of JPEG images when slower network speeds are detected for a client. Serving compressed images reduces the amount of data required to load a page, which can compensate for suboptimal network performance. Adaptive Image Compression:
- minimizes page-load times on client browsers by reducing the file size of JPEG images on slower networks,
- provides customized compression rates for different network conditions,
- operates dynamically, with no pre-analysis required,
- uses standard JPEG lossy compression to compress images,
- modifies image quality without changing image dimensions.
You don't need to change HTML code on your origin in order to use AIC.
How it works
- The edge server:
- detects the type of network that is delivering the request: mobile (cellular) or non-mobile,
- measures the network latency from the client device which is determined based on Round-Trip Time (RTT),
- based on the network type and latency, assigns the connection performance to one of the three performance tiers.
The edge server detects the network type, not the device using the network. For example, a laptop using a cellular network to reach your site is mobile, and a tablet using Wi-Fi is non-mobile.
- The edge server detects the network type (mobile or non-mobile) and the connection performance and then finds the appropriate image-quality setting in your AIC configuration. The edge server then checks its cache for a copy of the image at that quality setting, and:
- if the correct version is cached on the edge server, it serves the cached image,
- if the correct version is not cached, the edge server forwards the request to the image adaptation service.
- If the edge server forwards the request, then the image adaptation service:
- requests the original image from an edge server (which, if necessary, fetches it from the customer’s origin),
- applies the desired quality setting,
- returns the derivative image to the edge server.
- The edge server caches the derivative image and serves it to the requesting browser.
What AIC does to images
When using AIC to compress JPEG images, the edge server:
- strips the application segment metadata, which does not affect how the image is displayed or decoded,
- preserves the JPEG Comment (COM) segment, which may contain copyright information,
- if any type of exception occurs during processing or if the AIC compression increases the file size, serves the original, pristine image (“fail over”),
- serves unique entity tags (
ETags
) to browsers for different variations of images.
Note on caching
The edge server can distinguish different versions of the same image; at the same time it knows the versions are related. When a specific derivative is needed, the edge server only serves the requested version. Clearing the cache of the original image also clears all derivatives of that image.
Supported file types
AIC supports the following JPEG file extensions:
.jpg
.jpeg
.jpe
.jif
.jfif
.jfi
Configuring Adaptive Image Compression
About match criteria for AIC
You can have different AIC settings for different requests. For example, suppose you want to compress the large image on your splash page for slow mobile connections only, compress only the thumbnails of product images, and never compress your company logo. You would use these match criteria and behaviors:
Criteria | Behavior |
---|---|
If file name matches splash.jpg ... | ...then enable AIC for mobile network requests only and set the sliders for Poor Connections to 40. |
If path matches /thumbs/ ... | ...then enable AIC for all requests; set less compression for higher-quality connections. |
If file name matches one of either logo.jpg or logoWithTag.jpg ... | ...then disable AIC for both mobile and non-mobile network requests. |
Considerations for referrer hostname matches
When setting a match rule using a referrer hostname, be aware that there are instances where some clients may not send referrer information.
This situation occurs for referrer host entries (as opposed to host and path entries) because the referrer hostname may:
-
be removed or changed by users,
-
be removed if IE is used with certain JavaScript components and when
target="_blank"
in anchors or meta refresh, -
not be set when programming functions for opening and accessing files are used, or for applications that have browser-like components (wget, cURL, fsockopen),
-
not be set when users click embedded links in chat applications or Flash/PDF/Word/Excel documents.
For example, let's say you want to run a performance test (like Keynote, Gomez, or SiteAnalyzer) on an image to determine the performance benefits of AIC, and your AIC configuration has a referrer host match enabled. Unless you specifically instruct the test agents to send a referrer header, the test will not likely trigger AIC.
Image quality considerations
When selecting the image quality, consider the following:
- The values are relative quality rates. The higher the quality of your images, the lower your page performance will be. If the client's connection performs poorly to begin with, use lower-quality images to avoid degrading the performance further.
- Selecting a lower quality level will result in more data being lost during the compression/encoding process. The resulting file may be smaller in size than the original and of lower quality.
- Selecting a higher quality level will result in less data being lost during the compression/encoding process. The resulting file will be closer in size and quality to the original.
- In any case, the edge server will never serve a file that is larger than the original. If the quality setting would increase the file size, the edge server will serve the original image.
Features and options
Adaption Settings for Mobile Network Requests
Field | What it does | Sub-options |
---|---|---|
Enable | Enables or disables adaption settings for mobile network requests. | |
Excellent Connection | Select the extent of image adaption to perform for excellent connections. |
|
Quality | Enter post-compression image quality for excellent connections, where 100 represents high quality and low compression. | |
Poor Connection | Select the extent of image adaption to perform for poor connections. |
|
Quality | Enter post-compression image quality for poor connections, where 100 represents high quality and low compression. |
Adaption Settings for Non Mobile Network Requests
Field | What it does | Sub-options |
---|---|---|
Enable | Enables or disables adaption settings for non mobile network requests. | |
Excellent Connection | Select the extent of image adaption to perform for excellent connections. |
|
Quality | Enter post-compression image quality for excellent connections, where 100 represents high quality and low compression. | |
Good Connection | Select the extent of image adaption to perform for good connections. |
|
Quality | Enter post-compression image quality for good connections, where 100 represents high quality and low compression. | |
Poor Connection | Select the extent of image adaption to perform for poor connections. |
|
Quality | Enter post-compression image quality for poor connections, where 100 represents high quality and low compression. |
Tips and best practices
Use the same quality settings for multiple conditions
To improve cache-hit ratios, use the same quality values for closely-related network conditions. For example, if you use the settings below, you will have two copies of the image in the cache instead of three.
Network condition tier | Quality setting |
---|---|
Excellent | 70 |
Good | 70 |
Poor | 55 |
Review Time-to-Live (TTL) settings
The TTL settings for adapted images generated by AIC are the same as the TTL settings configured for the web site's images. For the best results, we recommend using long TTL values.
Purge cached content
Running a Content Control Utility (CCU) purge for the original URL will also purge from the edge servers all cached images generated by AIC.
Testing Adaptive Image Compression
AIC comes with a set of test cookies you can use to perform manual testing. These cookies can:
-
simulate different network conditions,
-
preview various AIC outputs.
We recommend you use these cookies only when testing your AIC configurations in the staging network.
Available cookies for testing
You can use cookies during testing to simulate different conditions. Available cookies include the following:
Cookie | Setting | Description |
---|---|---|
aic-bypass | true | Turns AIC off for a request, which is useful when trying to determine whether an issue is at origin or within the Edge Network. |
aic-quality | 1-100 | Manually sets quality level, overriding the detected network condition tier. Requests with this cookie will bypass the cache as they do not match a configured setting. |
aic-network | mobile | Makes requests appear to come from a mobile network. This is a useful testing method if you have enabled AIC for mobile networks only. |
aic-rtt | > 1 | Uses the value entered (in ms) to override the detected RTT value. (Enter <10 for excellent conditions or >1500 for poor conditions.) |
aic-failover | false | Turns off failover. With failover on, it is hard to detect web-page issues visually: When there are problems, AIC will fetch the original image. |
aic-cache | false | Turns off use of AIC's custom cache-h map. This is useful when diagnosing an issue. |
If you issue these cookies from your origin to test in the production environment, you will negatively impact caching.
Testing AIC cookies with a web development tool
-
Open a browser that has a web development tool built-in (e.g., Chrome or Firefox) or installed as an add-on.
-
Log into the staging network.
-
Visit a web page on the staging network that has AIC enabled.
-
In the browser, activate the web development tool.
-
Select the cookies option in the web development tool.
-
If any existing cookies are listed that begin with
aic-
, delete them. -
Create a new cookie.
-
Using the cookies listed in Available cookies for testing as a guide, enter:
-
the name of the AIC cookie you want to use (like
aic-quality
), and -
a value for the cookie.
-
-
Verify that the AIC cookie you entered is now listed.
-
Reload the web page and observe how AIC changes the page's JPEG images.
Testing AIC cookies using cURL commands
With the cURL command-line tool you can send or get files using URL syntax. You can use cURL commands with the AIC cookies to test your AIC configuration.
The following sections provide examples of requests and responses.
aic-bypass
aic-bypass
Example of request:
curl -o /dev/null -s --cookie "aic-bypass=true"
-w "Download time: %{time_total} (seconds)\tSize: %{size_download}\n" http://aic.edgesuite.net/hawaii/img/b-6.jpg
Example of response:
Download time: 2.973 (seconds)
Size: 8344074
aic-quality
aic-quality
AIC quality setting | Request | Response |
---|---|---|
100 | curl -o /dev/null -s --cookie "aic-quality=100" -w "Download time: %{time_total} (seconds)\tSize: % {size_download}\n" http://aic.edgesuite.net/hawaii/img/b-6.jpg | Download time: 4.364 (seconds) Size: 8344074 |
75 | curl -o /dev/null -s --cookie "aic-quality=75" -w "Download time: %{time_total} (seconds)\tSize: % {size_download}\n" http://aic.edgesuite.net/hawaii/img/b-6.jpg | Download time: 2.217 (seconds) Size: 2122066 |
50 | curl -o /dev/null -s --cookie "aic-quality=50" -w "Download time: %{time_total} (seconds)\tSize: % {size_download}\n" http://aic.edgesuite.net/hawaii/img/b-6.jpg | Download time: 1.918 (seconds) Size: 1444222 |
25 | curl -o /dev/null -s --cookie "aic-quality=25" -w "Download time: %{time_total} (seconds)\tSize: % {size_download}\n" http://aic.edgesuite.net/hawaii/img/b-6.jpg | Download time: 1.821 (seconds) Size: 964619 |
aic-network
aic-network
Example of command:
curl -o /dev/null -s --cookie "aic-network=mobile"
-w "Download time: %{time_total} (seconds)\tSize: %{size_download}\n" http://aic.edgesuite.net/hawaii/img/b-6.jpg
Example of response:
Download time: 0.250 (seconds)
Size: 2122066
aic-rtt
aic-rtt
AIC RTT Setting (ms) | Request | Response |
---|---|---|
10 | curl -o /dev/null -s --cookie "aic-rtt=10" -w "Download time: %{time_total} (seconds)\tSize: % {size_download}\n" http://aic.edgesuite.net/hawaii/img/b-6.jpg | Download time: 0.421 (seconds) Size: 2122066 |
100 | curl -o /dev/null -s --cookie " aic-rtt=100" -w "Download time: %{time_total} (seconds)\tSize: % {size_download}\n" http://aic.edgesuite.net/hawaii/img/b-6.jpg | Download time: 0.323 (seconds) Size: 1773148 |
400 | curl -o /dev/null -s --cookie "aic-rtt=400" -w "Download time: %{time_total} (seconds)\tSize: % {size_download}\n" http://aic.edgesuite.net/hawaii/img/b-6.jpg | Download time: 0.154 (seconds) Size: 1263692 |
600 | curl -o /dev/null -s --cookie "aic-rtt=600" -w "Download time: %{time_total} (seconds)\tSize: % {size_download}\n" http://aic.edgesuite.net/hawaii/img/b-6.jpg | Download time: 0.140 (seconds) Size: 1072851 |
Updated about 2 months ago