Dynamic Imaging Service

The Dynamic Imaging service (DIS) streamlines serving images to your storefront. The service eliminates the need to upload a catalog of different-sized images to meet your storefront requirements.

The service uses a single, high-resolution image as a source image that is dynamically transformed to your specifications, and served to your storefront. The DIS transformation parameters give you control over an image’s size, crop, overlay, format, background color, and quality settings. DIS eliminates the requirement to have your merchandising or creative images batch processed ahead of time to make them web friendly. Using a single image, DIS severs the correct sizes for each image application including your product page, catalog page, recommended products, search results, and others.

Scenario

Here’s an example that illustrates how DIS streamlines serving images.

Let's say you have a storefront website with a product catalog of 100,000 items. Your web design supports images up to 150x150 pixels, which display four images per row of the customer's search results. Your web designer creates a different layout, and now product searches display only three images sized 250x250 pixels per row. Instead of uploading a catalog with different-sized images, DIS uses the high-resolution images already stored in Commerce Cloud to serve up the new image sizes.

Dynamic Imaging Service Transformations

To take advantage of DIS, you configure and generate an image URL using the URLUtils and MediaFile classes. The API validates all transformation parameters, and protects your code from future changes. If the basic URL pattern changes, the API calls work, regardless of the changes. Hand coding a URL is not a best practice. The hand-coded URL is not protected from future changes. If you do not pass parameters to DIS, no action is taken, and the image is passed through in its original configuration, byte for byte.

Transformation Parameters

DIS can perform multiple operations to create images from high-resolution sources. Transformations are done in the following order. A value for each parameter is required.
  1. Image Format--Generates gif, jp2, jpg, jpeg, jxr, and png images. Supported source image formats include gif, jp2, jpg, jpeg, png, tiff, and tif.
  2. Image Crop--Generates an image that contains a cropped area taken from a larger image.
  3. Image Scale--Generates a scaled image with a locked aspect ratio.
  4. Image Overlay--Generates an image that overlays another image at a given position.
  5. Image Quality--Generates a JPG or PNG image that you can modify using the quality attribute. For image quality parameter settings, see the Image Quality reference in the Create Image Transformation URLs section.

Image Guidelines

Use these guidelines when preparing images for the DIS

  1. File size and dimensions–the platform serves any image regardless of the dimensions or file size of the original image. However, image files that exceed the following file size and dimensions, are not transformed but served in there original configuration. For example, transformation parameters set for an oversized image are not applied to the server image.
    1. File size greater than 6 mb
      Note: The first time an image over 6 mb is requested, an error is returned. All subsequent requests for the image are successful.
    2. Dimensions exceeding 3,000 x 3,000 pixels
  2. Dimensions exceeding 3,000 x 3,000 pixels
  3. Image crop–when setting crop transformation parameters, all the crop parameters are required.
  4. Transformation timeout–transformation must complete within 29 seconds If transformations cannot be completed with 29 seconds a 408 error code is returned, indicating a timeout. The error typically happens when performing expensive transformations on an animated gif. An expensive transformation like upsizing would have to be performed on each frame.
  5. Firefox users 2014–when serving images in staging, development, or sandbox, and Tracking Protection is on, the browser blocks the salesforce.com domains used for first-time transformations. To disable blocking images during testing in a sandbox, staging or development instance, go to the Firefox Privacy settings, and change Tracking Protection to Never. Blocking does not occur in production because images are not served from the Salesforce owned domains.