Cloudflare Mirage
Cloudflare Mirage reduces bandwidth used by images in mobile browsers. It can accelerate loading of image-heavy websites on very slow mobile connections and HTTP/1.
It does this by:
- Replacing images with low-resolution thumbnails, which are bundled together into one file.
- Acting as a lazy loader, deferring loading of higher-resolution images until they become visible.
JavaScript must be enabled for Mirage to work.
Comparison
- Polish seamlessly optimizes images for all browsers, not only mobile, and keeps images at full resolution.
- Image Resizing together with
loading="lazy"andsrcsetHTML attributes can achieve similar results as Mirage, but requires markup changes to implement.
Availability
| Free | Pro | Business | Enterprise | |
Availability | No | Yes | Yes | Yes |
Image formats compatible with Mirage
Mirage will work with the following image formats:
.jpg.jpeg.png.gif.img
Enable Mirage
To enable Mirage image optimization for your entire domain:
- Log in to the Cloudflare dashboard.
- Select your account and zone.
- Go to Speed > Optimization > Image Optimization.
- For Mirage, switch the toggle to On.
Test Mirage
Mirage’s features for Mobile Browser optimization are triggered based on high latency and poor network connections. You can test Mirage by making a request to your domain using a mobile user-agent string and one of the following flags with your domain in your mobile browser:
EXAMPLE.COM/?forcepreload
To run the pre-loader only and serve degraded images on the page enter:
EXAMPLE.COM/?forcepreloadonly
Here is an example where Mirage 2 is triggered by a ?forcepreloadonly flag. The notable image degradation is a sign that Mirage is working:
