It is sometimes difficult to figure out what the compression rate should be when configuring Adaptive Image Compression (AIC) without observing the impact on image quality. This post presents a solution to test the different levels of compression for the jpeg images without having to change anything in the Property Manager configuration nor play around with testing cookies.
You can adapt the AIC compression levels by changing the Property Manager behaviour (see Figure 1 below) but this requires you to update the configuration and publishes it again to Staging, then Production network.
Figure 1: the Adaptive Image Compression behaviour
Then you can override these settings at "runtime", by leveraging HTTP cookies that Akamai provides with AIC solution (ex: aic-quality, aic-network). You can find a complete description of this tool in AIC Quick Reference Guide. This makes the process easier since you don't need to change configuration.
The following solution places those cookies based on the presence/absence of query string parameters in the web page request to the web site. End-users can then enable/disable AIC and change AIC quality without having to update the configuration nor to change cookies.
WARNING: the solution described here is for pre-production environment and should not used in a real production network since performance may not optimum.
Description of the solution
The solution proposed here exposes to the users two simple commands:
1. enable AIC with a given Quality
The following command will enable AIC with a given quality:
Behind the scene the configuration will set the aic-quality cookie with the quality requested in <Q>.
After this request, any jpg image will be adapted to the quality <Q>.
<Q> can be a value among 1-100.
I have chosen to that the cookie will be set with an expiration type "on browser close".
2. disable AIC
Likewise in Enable AIC this command will unset the cookie aic-quality and images won't be adapted by AIC anymore after this point.
Example of a configuration
This is an example of a Property Manager configuration that implements this design.
The figure 2 shows an overview of the rules you are going to insert in your configuration. The rule "PoC AIC" is the parent rule of all the rules used in this solution.
Figures 2: overview of the rules
Beneath this main rule we have 3 rules at the same "childhood" level:
- the rule Enable AIC that enables AIC,
- the rule PoC AIC ON that as it names says activate AIC
- and the rule PoC AIC OFF that switches off AIC
The rule Enable AIC, as shown in Figure 3, is a typical activation of AIC conditioned to the presence of file extension jpg, and on the presence of the cookie "aic-quality". Observe that we have set all the qualities to 100%. This will be override by the cookie "aic-quality" sent by the web browser of the user.
Figure 3: the rule Enable AIC (activation of AIC)
The rule PoC AIC ON (figure 4) tests the presence of the query string "poc-ai=on" in the URL sent by end-user.
Figure 4: the rule PoC AIC ON
Beneath the rule PoC AIC ON we find the rule Set AIC quality (figure 5) and children rules that will set the browser cookie "aic-cookie" according to the query string parameter <Q> sent by the browser.
Figure 5: the rule Set AIC quality
Beneath the rule Set AIC quality we have defined 10 rules (one example shown in Figure 6), one for each step, that test the value of the query string parameter and set the cookie accordingly. Note that we could have set the exact value sent in the query string parameter but this could not have been done using standard Property Manager behaviour.
Figure 6: the rule 90%
Finally, the configuration ends with the rule PoC AIC OFF (figure 7) that unset the cookie "aic-quality" when the query string parameter "poc-aic=off" is detected in the URL sent by the browser. Note that to unset the cookie, we use the Set Response Cookie behaviour using the fixed expiration date in the past (ex: 1970).
Figure 7: the rule PoC AIC OFF disable AIC
Thank you very much to my colleagues Nitya Vasuki and Olivier Dutilleul for the "brain storming" and the setup of this solution.