CompressX Documentation

Everything you need to install, configure, and get the best performance from CompressX Free and Pro.

Changelog – Request a Feature

CompressX Docs

Documentation

Document Notice

Help Improve the Documentation

If you notice something unclear, outdated, or incorrect, feel free to let us know.

Your feedback helps keep the documentation accurate and useful for everyone.

WebP & AVIF Delivery Logic in CompressX

Jan 7, 2026 | Docs

This document explains how images are actually delivered, and how CompressX works with the browser to send the right size and format.

Image Delivery: The Real-World Process

WebP & AVIF Delivery Logic

When a page is loaded, the browser and the server work together to decide which image is finally delivered to the user.
The delivery process happens in four sequential stages.

Stage 1: HTML Parsing (What the Page Provides)

What Happens:

  • 1. The browser parses the HTML.
  • 2. It discovers image references.
    • img tags
    • picture tags (if used)

Important Point
At this stage:

  • No image format is chosen yet
  • No image size is chosen yet

The browser only knows what options are available.

Stage 2: Responsive Candidate Evaluation (Size Decision)

Note
This stage happens before format replacement.

What Happens
The browser evaluates:

  • Layout width (CSS pixels)
  • Device Pixel Ratio (DPR)
  • Available responsive breakpoints (srcset)

Then it selects: The most suitable image size candidate.

Responsive breakpoints are generated and managed by CompressX.
CompressX prepares a set of image size candidates based on your configuration.
The browser evaluates these candidates and selects the most suitable size for the current device.

Stage 3: Image Request (Browser → Server)

What Happens

  • The browser sends an image request.
  • The requested URL is still: JPEG or PNG (Original image path)

The browser does not request “WebP” or “AVIF” explicitly in most cases.

Stage 4: Image Replacement (Format Decision)

What Happens
The server decides whether to replace the image format.
CompressX can apply one of the following strategies:

  • Option: Rewrite Rule Mode
    Returns WebP or AVIF if supported (avif -> webp ->jpg/png).
  • Option: picture Tag Mode
    Returns WebP or AVIF if supported (avif -> webp ->jpg/png).
  • Option: Compatible Rewrite Rule Mode
    New thumbnails will be generated without watermarks, including JPG, PNG, WebP, and AVIF versions.
Tip
Image replacement happens after the browser has already decided the image size.

Stage 5: Image Delivery to the User

Final Result
The browser receives:

  • A specific image size.
  • In the best supported format

This means:

  • Format optimization ≠ size optimization.
  • Both must work together

Key Takeaway (Process-Oriented)

  • Image delivery follows a strict order.
  • Size selection always happens before format replacement
  • WebP / AVIF alone does not guarantee fast loading
  • Breakpoints are critical on mobile, tablet and desktop devices