Skip to content

Image Optimization API Parameters

Peakhour's Image Optimization API provides on-the-fly image transformation and optimization capabilities. Transform, resize, and optimize images automatically at the edge for improved performance and user experience.

Overview

The Image Optimization API uses URL parameters to specify transformations. All transformations are applied automatically and cached at our global edge locations for optimal performance.

API Endpoint Structure

https://yoursite.com/path/to/image.jpg?param1=value1&param2=value2

Available Parameters

Image Format

  • format - Convert between image formats (JPEG, PNG, WebP, AVIF)

Resizing & Dimensions

  • resize - Resize images with various scaling options
  • fill - Fill specific dimensions with cropping and padding options

Content Overlay

  • txt - Add text overlays with custom positioning and styling

Automatic Optimization

  • auto - Automatic format selection and quality optimization

Color and Styling

Quick Examples

Basic Resizing

https://yoursite.com/image.jpg?resize=300x200

Format Conversion

https://yoursite.com/image.jpg?format=webp&auto=compress

Smart Cropping

https://yoursite.com/image.jpg?fill=400x300&auto=faces

Text Overlay

https://yoursite.com/image.jpg?txt=Hello%20World&txt-size=24&txt-color=white

Performance Features

  • Global Edge Caching - Optimized images cached worldwide
  • Automatic Format Selection - Serve best format for each browser
  • Quality Optimization - Balance file size and visual quality
  • Lazy Loading Support - Optimize for modern loading strategies

Supported Input Formats

  • JPEG (.jpg, .jpeg)
  • PNG (.png)
  • GIF (.gif)
  • WebP (.webp)
  • SVG (.svg)
  • BMP (.bmp)

Supported Output Formats

  • JPEG - Universal compatibility
  • PNG - Transparency support
  • WebP - Modern browsers, excellent compression
  • AVIF - Next-generation format with superior compression

Best Practices

Performance Optimization

  • Use auto=compress for automatic quality optimization
  • Specify exact dimensions when possible to prevent layout shift
  • Use WebP format for modern browsers when supported

Quality Control

  • Test different quality settings for your specific images
  • Monitor Core Web Vitals impact of image optimizations
  • Use progressive JPEG for large images

Caching Strategy

  • Image transformations are cached permanently at the edge
  • Original images are cached according to your cache settings
  • Use consistent parameters to maximize cache hit rates

Integration Examples

Responsive Images

<img src="/hero.jpg?resize=800x600" 
     srcset="/hero.jpg?resize=400x300 400w,
             /hero.jpg?resize=800x600 800w,
             /hero.jpg?resize=1200x900 1200w"
     sizes="(max-width: 400px) 400px,
            (max-width: 800px) 800px,
            1200px"
     alt="Hero image">

CSS Background Images

.hero {
  background-image: url('/hero.jpg?fill=1920x1080&format=webp&auto=compress');
}

@media (max-width: 768px) {
  .hero {
    background-image: url('/hero.jpg?fill=768x432&format=webp&auto=compress');
  }
}

For detailed parameter documentation and examples, see the individual parameter reference pages.