Skip to main content

Image Optimizer

Image Optimizer is a fast and secure standalone server for resizing and converting remote images. The main principles of Gjirafa CDN are simplicity, speed, and security. Image Optimization feature provides you with on-the-fly image processing capabilities, through Gjirafa CDN. Features of the Image Optimizer include:

  1. Resize - Defines how Gjirafa CDN will resize the source image.
  2. Width - Defines the width of the resulting image.
  3. Height- Defines the height of the resulting image.
  4. Gravity - When Gjirafa CDN needs to cut some parts of the image, it is guided by the gravity property.
  5. Enlarge
  6. Blur
  7. Sharpen
  8. Quality

Steps to follow when Enabling Image Optimizer#

The section below summarizes the process enabling optimizes:

To enable Image Optimizer:

  1. Sign To GjirafaTech Captain and got to Distributions.
  2. Select a Distribution and then go to Distribution Settings.
  3. On General page go to Edit and enable Image Optimizer.

Generating the URL#

The URL should contain the processing options like this: image_url?processing_options e.g https://jroh9k023r.gjirafa.net/captain/images/optimizer/winter.jpg?width=600&height=400&quality=80

Processing options should be specified as URL query parts divided by ands (&). Processing option has the following format:

?option_name=argument

Gjirfa CDN supports the following processing options:#

Resize#

Defines how imgproxy will resize the source image.\ ?resize=resizing_type\ ?r=resizing_type\ Supported resizing types are:

  • fit: resizes the image while keeping aspect ratio to fit given size
  • fill: resizes the image while keeping aspect ratio to fill given size and cropping projecting parts
  • auto: If both source and resulting dimensions have the same orientation (portrait or landscape), Gjirafa CDN will use fill. Otherwise, it will use fit.

Default fit \ For example:

https://jroh9k023r.gjirafa.net/captain/images/optimizer/winter.jpg?width=400&height=400&r=fit

Width#

Defines the width of the resulting image. When set to 0, Gjirafa CDN will calculate the resulting width using the defined height and source aspect ratio. When set to 0 and rezizing type is force, Gjirafa CDN will keep the original width.

  • ?width=width_number
  • ?w=width_number
  • width_number = integer 0 - 10000

Height#

Defines the height of the resulting image. When set to 0, GJirafa CDN will calculate resulting height using the defined width and source aspect ratio. When set to 0 and rezizing type is force, GJirafa CDN will keep the original height.

  • ?hieght=height_number
  • ?h=height_number
  • height_number = integer 0 - 10000

Gravity#

When GjirafaCDN needs to cut some parts of the image, it is guided by the gravity. ?gravity=gravity ?g=gravity gravity can take one of the following values

  • no: north (top edge);
  • so: south (bottom edge);
  • ea: east (right edge);
  • we: west (left edge);
  • noea: north-east (top-right corner);
  • nowe: north-west (top-left corner);
  • soea: south-east (bottom-right corner);
  • sowe: south-west (bottom-left corner);
  • ce: center. \

Exampe: https://jroh9k023r.gjirafa.net/captain/images/optimizer/winter.jpg?width=300&height=300&r=fill&g=ea

Enlarge#

When set to 1, t or true, Gjirafa CDN will enlarge the image if it is smaller than the given size.

  • ?enlarge=enlarge
  • ?el=enlarge
  • enlarge = 1, t, true

Blur#

When set, Gjirafa CDN will apply the gaussian blur filter to the resulting image. sigma defines the size of a mask Gjirafa CDN will use.

  • ?blur=sigma
  • ?bl=sigma

Example: https://jroh9k023r.gjirafa.net/captain/images/optimizer/winter.jpg?bl=2

Sharpen#

When set, Gjirafa CDN will apply the sharpen filter to the resulting image. sigma the size of a mask Gjirafa CDN will use.

  • ?sharpen=sigma
  • ?sh=sigma

As an approximate guideline, use 0.5 sigma for 4 pixels/mm (display resolution), 1.0 for 12 pixels/mm and 1.5 for 16 pixels/mm (300 dpi == 12 pixels/mm).

Quality#

Redefines quality of the resulting image, percentage.

  • ?quality=quality
  • ?q=quality